25、vuex改变store中数据

以登录为例：

1、安装vuex：npm install vuex --save


2、在main.js文件中引入：

import store from ‘@/store/index.js‘new Vue({
  router,
  store,
  render: h => h(App)
}).$mount(‘#app‘)

3、在src文件目录下新建一个名为store的文件夹，为方便引入并在store文件夹里新建一个index.js,里面的内容如下:

import Vue from ‘vue‘
import Vuex from ‘vuex‘

Vue.use(Vuex)

export default new Vuex.Store({
    state: {
        Token: ‘‘,        userName:‘‘
    },
    //同步方法
    mutations: {
        SET_TOKEN(state, params) {
            // console.log(params.Token, params.userNo);
            state.Token = params.Token;            state.userName=params.userName;

} }, })

3、在登录页面派发事件：

this.$store.commit("SET_TOKEN", payload); // payload 为参数

4、在其他页面获取state中的共享数据：

import { mapState } from "vuex";

computed: {

...mapState({

userName: state => state.userName,

})

},

在页面dom中引入：{{userName}}

在methods中调用：this.userName

原文地址：https://www.cnblogs.com/xlfdqf/p/11238727.html