vue中深度监听vuex中的值的变化
1、首先用npm引入vuex;
2、创建一个vuex的js文件 比如:在store文件夹下面创建index.js文件;
3、在main.js中引入并绑定到vue原型上;
import store from './store/index'
Vue.prototype.$store = store;
index.js文件
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);
let store = new Vuex.Store({
state:{
deviceId:"",
},
getters:{
},
actions:{
},
mutations:{
// 加油站的id
setDeviceId(state, val){
state.deviceId = val;
},
}
});
export default store;
4、向vuex中存值
this.$store.commit("setDeviceId",val);
5、在另外一个组件中深度监听
watch:{
deviceId:{
handler(deviceId){
//this.device_id = deviceId.id;
//this.requireDeviceList(deviceId.id);
},
deep: true,
immediate: true,
}
},
computed:{
deviceId(){
return this.$store.state.deviceId;
}
},