道具更改时Vue子组件没有重新渲染？答案

【问题标题】：Vue child component didn't rerender when props changed?道具更改时Vue子组件没有重新渲染？
【发布时间】：2018-12-30 21:10:33
【问题描述】：

在我的应用程序中，我使用 vuex 来管理我的组件状态，当状态改变时 vuex 突变，子组件没有重新渲染。这是我在 CodeSandbox 上的代码：https://codesandbox.io/s/l3lrwv6yll

当我单击 蓝色区域 中的标题以将项目添加到 红色区域 时，突变起作用了。但是当我单击编辑按钮时，我的 Header 组件中的计算属性没有改变。

谁能帮帮我？

【问题讨论】：

标签： vue.js components vuex

【解决方案1】：

在您的突变editField 中，您应该使用Vue.set 来检测数组的变化：

   editField(state, { index }) {
      let update = state.formFieldList[index];
      Vue.set(state.formFieldList, index, {
        name: update.name,
        schema: {
          ...update.schema,
          edit: true
        }
      })
    },

查看 Vue 文档 - Array Changing Caveats

【讨论】：