Vuex mapState doesn´t trigger computed property-CodePudding

I have V-Data-Table. The Items in there are from a computed property, that should trigger when the mapState changes, but it doesn´t.

GOAL: The computed property triggers when the state in the Vuex store changes.

The state changes via a method, that is called by button. After the changes in the store the mapState changes. After that the computed property should trigger.

Computed property:

computed: {
    TransportItemsFiltered() {
        return this.TransportItems.filter((i) => {
            console.log('Filter ausgeführt')
            return i.show == true;
        }
        );
    },
    ...mapState({
        TransportItems: state => state.articleDetails.transport,
        loading: state => state.articleDetails.transportLoader
    })
},

Mutation where state.articleDetails.transport changes

SET_DATEFILTER_TRANSPORT(state, payload) {
    console.log(payload.i)
    console.log(payload.boolean)
    state.transport[payload.i].show = payload.boolean
},

CodePudding user response：

Try to update the array reference.

SET_DATEFILTER_TRANSPORT(state, payload) {
    console.log(payload.i)
    console.log(payload.boolean)
    state.transport[payload.i].show = payload.boolean
    state.transport = [...state.transport]
},