使用watch监听vuex状态更新问题

你可以使用Vuex提供的subscribe方法来监听状态的变化。

在你的store模块中，先定义一个mutation类型：

export const SOME_MUTATION = 'SOME_MUTATION'

在mutations中定义对应的mutation：

mutations: {
  [SOME_MUTATION] (state, payload) {
    state.someState = payload
  }
}

然后在你的组件中，使用Vuex提供的subscribe方法来监听状态的变化：

mounted() {
  this.unwatch = this.$store.subscribe((mutation, state) => {
    if (mutation.type === SOME_MUTATION) {
      console.log('state changed:', state.someState)
    }
  })
},
beforeDestroy() {
  this.unwatch()
}

在组件的mounted生命周期中，使用subscribe方法来监听状态的变化，并且将返回的方法赋值给一个变量，以便在组件销毁前取消监听。在监听的回调函数中，你可以通过mutation.type来判断状态发生了哪些变化，然后执行相应的操作。

相关问题

使用watch监听vuex状态更新后获取值不更新问题

如果你使用`watch`监听`vuex`状态更新后获取值不更新，可能是因为`watch`监听的是`vuex`状态对象的引用，而不是它的属性。当你修改状态对象的属性时，它的引用不会改变，因此`watch`不会触发。

解决方法是使用`deep`选项来深度监听状态对象的变化，例如：

watch: {
  '$store.state.someProperty': {
    handler: function (newVal, oldVal) {
      // do something
    },
    deep: true
  }
}

这样就可以深度监听`vuex`状态对象的变化了，当对象属性改变时，`watch`会触发。

使用watch监听 解决vuex状态更新后获取值不更新问题

当 Vuex 状态发生变化时，我们可以使用 Vue 中的 `watch` 方法来监听状态变化，并在状态发生变化时执行相应的操作。具体的实现步骤如下：

1. 在组件中引入 `Vuex` 并获取需要监听的状态。

import { mapState } from 'vuex'

export default {
  computed: {
    ...mapState(['count']) // 获取状态
  },
  watch: {
    count(newVal, oldVal) { // 监听状态
      console.log(`count 更新了，新值为：${newVal}，旧值为：${oldVal}`)
    }
  }
}

2. 在组件中使用 `watch` 监听状态变化。

watch: {
  count(newVal, oldVal) { // 监听状态
    console.log(`count 更新了，新值为：${newVal}，旧值为：${oldVal}`)
  }
}

在上述代码中，我们使用 `watch` 方法来监听 `count` 状态的变化，并在状态变化时打印出新值和旧值。

需要注意的是，`watch` 监听的是状态的变化，而不是状态的引用变化。因此，如果状态是一个对象，那么需要监听对象属性的变化，而不是对象本身的变化。可以使用 `$watch` 方法来监听对象属性的变化。

this.$watch(
  () => this.$store.state.obj,
  (newVal, oldVal) => {
    console.log('obj 变化了', newVal, oldVal)
  }
)

总之，使用 `watch` 监听 Vuex 状态的变化可以解决状态更新后获取值不更新的问题。