VUE_监听vuex数据的方法

监听单个数据

vuex数据

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
	state: {
		memberType:0
	},
	mutations: {
	},
	actions: {
	},
	modules: {
	}
})

页面处理

data() {
	return {
	}
},
computed:{
	//计算vuex数据并返回
	stateMemberType(){
		return this.$store.state.memberType
	}
},
watch:{
	//监听vuex数据
	stateMemberType(e){
		console.log('数据发生了改变',e)
	}
},

深度监听数据

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
	state: {
		data:{
			name:"123",
			age:10
		}
	},
	mutations: {
	},
	actions: {
	},
	modules: {
	}
})

页面处理

data() {
	return {
	}
},
computed:{
	//计算vuex数据并返回
	stateMemberType(){
		return this.$store.state.data
	}
},
watch:{
	//监听vuex数据
	stateMemberType: {
		immediate: true,
		deep:true,
		handler: function (newval) {
			console.log('数据发生了改变',newval)
		},
	}
},