Сгенерировать динамическое поле данных с использованием дочернего компонента

Я хочу создать динамическое поле данных, используя значение свойства, переданное в дочернем компоненте.

Код:

 ...

    <datafieldcheckbox :categories = "abc" @call-method = "callfilteredproducts"></datafieldcheckbox>

    new Vue({
          el: "#app",
          data: {
            abc: null, // this will generate based on a value of prop passed in child component.
            products: [
                          {
                            "id": "1",
                            "name": "Product1",
                            "abc": "EEE",
                            "skill": "Easy",
                            "color": "blue",
                            "price": 100.00
                          },
                          {
                            "id": 2,
                            "name": "Product2",
                            "abc": "EEE",
                            "skill": "Intermediate",
                            "color": "red",
                            "price": 120.00
                          },
                          {
                            "id": 3,
                            "name": "Product3",
                            "abc": "Office",
                            "skill": "Intermediate",
                            "color": "green",
                            "price": 190.00
                          }
                    ]
              ...
const dfCheckBox = Vue.component('datafieldcheckbox', {
            template: `<div id = "one">
                    <h4><strong>Categories</strong></h4>
                    <ul class = "categoriesFilter">
                        <li v-for = "category in categories"><label><input type = "checkbox" :id = "category" :value = "category" v-model = "selectedFilters.categories" @click = "filterProducts()"><span class = "categoryName">{{category}}</span></label></li>
                    </ul>   
                    </div>`,
            data() {
                return{
                    products : null,
                    selectedFilters: {
                        categories: [],
                        colors: [],
                        minPrice: null,
                        maxPrice: null
                    }
                }
        },
        props : ['categories'],
        methods: {
            filterProducts(){
                    this.$emit('call-method', this.selectedFilters);
            }
        }
        });

как в приведенном выше коде. Если я напишу abc, он сгенерирует такой код в родительском данные:

Теперь предположим, что у меня есть данные в продуктах, и я хочу найти уникальные значения ключа, который передается из дочерних свойств.