vue.js - Vue / Vuex 状态变化不影响父母

Question

我在子组件中有一个输入。它的值在那里更改并存储在状态中。父组件将该值用于某些逻辑。当我更改孩子的值时，我认为父母会检测到状态变化。我发现只有当父级本身更新时才会获得更改的数据。

我是 Vue 和状态管理的新手。我认为状态变化会立即反映在使用变量的任何地方，无论是父母还是孩子。我有点认为状态就像一个无处不在的以太，如果映射/导入到一个组件中，它将渗透到一切。

Answer 1

在 Vuex 存储中更改对象的子对象时，有时 Vue 无法正确显示。当我尝试查看存储对象并且对象的某些子键值发生更改时，我遇到了这个问题。我通过复制整个对象来解决这个问题；

全局声明这个克隆函数，

_cloneObj: function(obj){
   return JSON.parse(JSON.strigify(obj));
}

现在，每当更改存储中的值时都使用此函数，例如

CHANGE_STORE: (state,newValue) =>{
   let obj =  _cloneObj(state.your_object); // this will give you clone of the store obkect
   obj.your_key = newValue; // change the value you want
   state.your_object = obj; // set the value back to store
}

商店会将此视为整个对象的更改，并且会随处反映。