初学者使用Vuex 遇到的问题及解决方案 (自己在项目中遇到的问题及解决方法) 1. 在组件中，怎么获取通过mutat

methods: {
    //    字体大小设置
    setFontSize(fontSize) {
        this.$store.commit('setFontSize', fontSize)
    }
}

mutations: {
    setFontSize(state, payload) {
            state.defaultFontSize = payload
    },
}

容易掉的坑：在组件的data里获取数据
```
data() {
    return {
        defaultFontSize: this.$store.state.defaultFontSize
    }
}
```
这种方法确实可以获得defaultFontSize 的值，但是不能动态的获取，也就是说这里的得到的defaultFontSize不会改变

因为data 中的内容只会在 created 钩子触发前初始化一次，这时属性的值是纯粹的字面量，JS 字面量赋值后显然不会自动更新
解决方法： 在computed里获取数据

computed 是通过【依赖追踪】实现的，在 computed 求值时引用的 Vue 变量变化时，会触发对 computed 的重新计算。可以使用 computed 去引用 Vuex 状态变量，从而使得依赖追踪生效。
```
computed: { 
    defaultFontSize() {
        return this.$store.state.defaultFontSize
    }  
},
```

在上面的问题我们解决了动态获取state数据的问题，但是在项目中，发现想要在组件的方法中使用这个数据，又出现了无法动态获取state数据的问题

查阅一些相关资料，解决办法如下：

在组件内，监听全局参数的变化，参数变化后调用组件内需要触发的函数

watch: {
        defaultFontSize (newVal, oldVal) {
            // 数据变化后调用setFontSize()
            this.setFontSize()
        }
},

资料来源：

初学者使用Vuex 遇到的问题及解决方案 (自己在项目中遇到的问题及解决方法)