vue中使用watch监听vuex中的数据变化

最新推荐文章于 2025-04-15 08:36:33 发布

kq-blue

最新推荐文章于 2025-04-15 08:36:33 发布

阅读量4.7k

点赞数 1

分类专栏：遇到的问题文章标签： vue.js javascript 前端前端框架

本文链接：https://blog.csdn.net/m0_55074611/article/details/120305197

版权

遇到的问题专栏收录该内容

4 篇文章

订阅专栏

本文介绍了在Vue组件中如何通过watch监听Vuex store中的数据变化，提供了两种实现方式：一种是在computed属性中获取state数据并watch；另一种是直接在watch选项中监听$store.state的特定属性。这两种方法都能实现实时响应Vuex状态的更新，并在数据变化时执行相应的处理逻辑。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在watch中监听vuex中的数据

在watch中监听Vuex中state的数据
- watch监听

在watch中监听Vuex中state的数据

watch监听

方法一：

在computed 计算属性和watch 监听中写入

export default{
	component:{},
	data(){
		return{}
	},
	computed:{
		tagArr(){
			return this.$store.state.homex.tag
		}
	},
	watch:{
		tagArr(newVal,oldVal){
			//对数据进行操作
			console.log(newVal,oldVal)
		}
	},
	methods:{},
}

方法二：

在watch 中写入

export default{
	component:{},
	data(){
		return{}
	},
	computed:{},
	watch:{
		'$store.state.homex.tag'(newVal,oldVal){
			//对数据进行操作
			console.log(newVal,oldVal)
		}
	},
	methods:{},
}