Vuex не реагирует, когда я фиксирую из другого компонента - PullRequest
0 голосов
/ 30 апреля 2019

У меня есть Product компонент и его вложенный компонент, называемый Filter.

В Product компоненте I перечислены все продукты.

// Product Component

// Scripts
        computed: {
            products() {
                return this.$store.getters.getServerData.products;
            },
            ...mapGetters({
                serverData: 'getServerData'
            })
        },

//Template
<div v-for="product in products" :key="product.id" class="w-full md:w-1/3 px-3">

     <product-item :product="product"></product-item>

</div>

<attribute-filter :attributes="serverData.attributes"></attribute-filter> // Filter

Когда я фильтрую продукты, я помещаю фильтрованные продукты в новый массив и обязуюсь установить этот массив в состояние.

// Filter Component

<script>
    import {mapGetters} from 'vuex';

    export default {
        props: ['option', 'attribute'],
        computed: {
            products() {
                return this.$store.getters.getServerData.products;
            },
            ...mapGetters({
                filters: 'attribute/getFilters',
                serverData: 'getServerData'
            })
        },
        methods: {
            toggleFilter(option) {
                option.attributeCode = this.attribute.code;

                this.$store.dispatch('attribute/toggleFilter', option);

                let filteredProducts = this.products.filter((product) => {
                      // Logic code to filter product                   
                      ....
                });

                let data = this.serverData;
                data['products'] = filteredProducts;

                this.$store.commit('setData', data);
            }
        }
    }
</script>

После того, как я установил новые данные массива в состояние, вычисленные компоненты products и serverData в Product не реагируют. Я попытался распечатать, то, что я получил, это undefined.

И я получил эту ошибку:

[Vue warn]: Error in render: "TypeError: Cannot read property 'attributes' of undefined"

found in

---> <ProductPage> at resources/js/components/Product/ProductPage.vue
       <App> at resources/js/components/App.vue
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...