watch监听vuex数据改变,实现自动改变兄弟页面数据

<>实例图

<>实现原理和思想

<>原理

1.vuex数据共享
2.watch监听数据数据的改变

<>逻辑

1.在vuex中的state中创建键值对 isRed:false
2.找到A组件(想要共享出去数据的组件)method中的共享数据的方法,使用 that.$store.state.isRed赋值
3.在vuex的actions中创建一个方法获取共享数据(方法名随意)
getCollectAppList(state,str){ this.state.isRed = str },
4.找到B组件(想要得到数据的组件)
分两种结果:
1. 直接用this.state.isRed 获取改变值::即使vuex的简易传值可用于父子.兄弟传值 2. watch监听
'$store.state.isRed'(val, oldVal){ console.log(val, oldVal,"watch监听事件");
//打印出结果isRed的前世和今生值 if (!val || !oldVal) { this.getCollectAppList() 加if
判断条件来改变你想要的事件触发} }

• « 上一篇：羊了个羊 通关代码思路
• » 下一篇：《羊了个羊》一夜爆红？产品运营带来的巨大红利