javascript - 观察者不使用 Vuex
问题描述
我遇到了一个问题,即我的组件中的数据更改时没有触发观察者。数据中的属性是反应性的,因为它是在组件创建时设置的,而不是稍后设置的。
这是一段代码,其中的问题是:
https://codesandbox.io/s/nlpvz0y6m
为了更详细地解释,status 属性从父级获取其状态,实习生从 Vuex 状态对象获取它,它被成功传递给组件,因为我能够记录并更改它。
但是,当我设置一个观察者时,在它的值发生变化时执行一个函数,它根本不会触发。无论我如何进行更改 - 无论是使用组件的内部方法还是事件。
我需要的是观察者在状态属性更改时触发,但不确定为什么它根本不反映它。
结构如下:BottomBar 是父组件,一个 bool 值作为属性传递给 Spin.vue 作为 prop,然后将 prop 分配给子组件上的 data 属性。
bool 值本身来自 Vuex 实例所在的 index.js。
解决方案
在控制台中,它显示以下两个错误
[vuex] unknown getter: isSpinning
[vuex] unknown mutation type: spinIt
问题似乎是商店的设置方式。尝试这个。
export const store = new Vuex.Store({
state: {
controls: {
spin: false
}
},
getters: {
isSpinning: state => {
return state.controls.spin;
}
},
mutations: {
spinIt(state) {
return (state.controls.spin = !state.controls.spin);
}
}
});
推荐阅读
- python - 正则表达式匹配可选点
- c# - 如何使用衍生 api 或 Autodesk.forge 库 c# 从 dwg 文件中检索图层列表
- c# - RabbitMQ:System.Net.Sockets.SocketException:现有连接被远程主机强行关闭
- ansible - 将 curl PUT 命令转换为 ansible uri
- java - 如何删除 XML 标记中的属性前缀?
- java - 功能
. TOP 不存在 - node.js - mongoose nodejs如何从数据库和用户项目数组中删除项目
- python - 如何获得卡方值作为 scipy.optimize.curve_fit 的输出?
- shell - 如何在docker镜像中替换conf文件中的文本
- prestashop - Prestashop 慢后台 (initContent : 12000ms)