【发布时间】:2021-06-16 04:51:38
【问题描述】:
当我选择绑定到一个 v 模型:
<v-col v-for="(item, i) in searchModule.allHeaders" :key='i' cols='2'>
<v-checkbox
v-model='selectedColumnHeaders'
:label="item.text"
:value="item"
color="primary"
hide-details
></v-checkbox>
</v-col>
我试图在 Vue 观察程序中执行此操作,因此当我选中或取消选中时数组更改时,我会更新数组对象属性,但是当我尝试执行此操作时,我收到了这个奇怪的 Vuex 错误!而且我什至没有在这里使用 Vuex!这是一个框架错误还是我误解了观察者的工作方式?顺便说一句,我正在使用 Nuxt。
这是我在观察者中的代码:
watch: {
// columns for table regen
selectedColumnHeaders(newVal, oldVal) {
/*
This is how we change the header's active status, by default some are active and some aren't,
but when a user checks the check box to regenerate a table, we need to change these active key-value pairs, we do it here.
*/
if (newVal !== oldVal) {
this.selectedColumnHeaders.map((header) => {
(header.active === false) ? header.active = true : null;
});
}
}
},
当我点击创建 Vue 实例时已经检查的标题时它可以工作([{ text: 'some text' value: 'some value, active: true }, etc..]),但是当我点击在创建 Vue 实例时 active 属性为 false 的复选框上,我收到此错误:
“错误:[vuex] 不在突变处理程序之外改变 vuex 存储状态。”
这个组件或父组件中没有Vuex! (它存在于应用程序的其他地方),但我正在“变异”的数据不在商店中......非常困惑,感谢任何帮助
【问题讨论】:
标签: vue.js nuxt.js vuetify.js vuex