VUEX怎么修改state数据？

我们知道在VUEX中获取state数据可以通过this.$store.state.变量名进行获取，那么按常理来说，要想修改这个变量我们重新给他赋个值就行了。

this.$store.state.helloWorld = "你好世界"

不过官方不建议这么做，因为直接赋值的话我们VUEX无法对这个变量进行跟踪，无法得知state中的helloWorld变量在哪里被修改了；所以下面我们使用官方推荐的方案。首先我们来到VUEX所在的入口文件中，写入mutations对象

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

//全局注册Vuex
Vue.use(Vuex)

//定义并导出Vuex对象，供其他文件使用
export default new Vuex.Store({
    store : {
        helloWorld : 'Hello World!'
    },
    mutations : {
        //在这里定义修改helloWorld的方法,到时候调用SET_HW就可以修改了
        SET_HW (str) {
            this.helloWorld = str
        }
    }
})

接下来我们来到需要修改helloWorld变量的文件中，在methods中定义一个函数

methods : {
    //这里我们新建一个函数给组件调用
    onClick () {
        //第一个参数为mutations中定义的函数，第二个参数为该函数的参数
        //如果有多个参数需要传递可以使用对象{}
        this.$store.commit('SET_HW', '你好世界')
    }
    
}