变异时Vuex没有反应答案

【问题标题】：Vuex not reactive when mutate变异时Vuex没有反应
【发布时间】：2019-04-24 00:24:45
【问题描述】：

我的state 中有一个数组tour_plan，其中包含一个对象。

tour_plan = [
    {
        day:1,
        location_id:3,
        location_name:'Colombo'
    }
]

我想做这个对象

tour_plan = [
    {
        day:1,
        location_id:3,
        location_name:'Colombo',
        tour_id:3,
        tour_name:'City tour'
    }
]

在 gothhourgh 之后，vuex 中的文档发现这在 vuex 突变中不会以反应方式起作用。

state.tour_plan[state.tour_plan.length - 1].tour_id = payload.tour_id;
state.tour_plan[state.tour_plan.length - 1].tour_name = payload.tour_name;

所以我尝试了这两种方法。

state.tour_plan[state.tour_plan.length - 1] = { ...state.tour_plan[state.tour_plan.length - 1],
                tour_id: payload.tour
             };

Vue.$set(state.tour_plan[state.tour_plan.length - 1], 'tour_id', payload.tour);

但其中没有一个也不起作用。我的代码哪里出了问题？

【问题讨论】：

标签： vuejs2 vuex

【解决方案1】：

你说得对，你不能在不“破坏”反应性系统的情况下通过索引访问来改变对象/数组项。

关于您尝试过的内容，根据Vue.set 的文档，它希望将整个对象/数组而不是长度作为第一个参数。

所以正确的方式是：

Vue.$set(state.tour_plan, 0, payload.tour);

其中 0 是要更新（替换）的元素的索引

【讨论】：

感谢您在回答的帮助下提供的线索，我找到了一种方法。

【解决方案2】：

这对我有用。

   Vue.set(state.tour_plan[state.tour_plan.length - 1], 'tour_id', payload.tour)
   Vue.set(state.tour_plan[state.tour_plan.length - 1], 'tour_payment', payload.tour_payment)
   Vue.set(state.tour_plan[state.tour_plan.length - 1], 'tour_name', payload.tour_name)

【讨论】：