向vuex存儲數據和獲取數據-和直接調用actions.js中的異步方法

向vuex的變量存儲數據
1.在state.js中添加  userInfo: {},
2.actions.js中添加同步用戶信息-將參數userInfo傳遞給USER_INFO
  創建一個方法-不用異步方法
    syncUserInfo({commit}, userInfo){
      commit(USER_INFO, {userInfo});
    },
3.創建一個中間變量mutation-types.js
    export const USER_INFO = 'user_info';
4.在actions.js中引入變量-USER_INFO
  import {
    USER_INFO
  } from './mutation-types'
5.在mutations.js中引入變量
     import {
        USER_INFO
      } from './mutation-types'
   將userInfo賦值給state
      [USER_INFO](state, {userInfo}) {
        state.userInfo = userInfo;
      },
6.外界直接調用actions.js中的方法   syncUserInfo
 import {mapActions} from 'vuex'
  methods: {
    //  存到vuex-是個方法。需要...延展符展開
    ...mapActions(['syncUserInfo']),
  }
  ------------------
  向vuex中獲取數據
  1.引入  import {mapState} from 'vuex';
  2.計算屬性
        computed:{
          ...mapState(['userInfo'])
        },

　　------------------------------------------

直接調用vuex-中 actions.js的異步方法--

this.$store.dispatch

    created(){
       // 調用vuex-actions中的方法-剛進入app，就需要驗證登錄的時效性
       this.$store.dispatch('getUserInfo')
    },

　　actions.js

  // 7. 異步獲取用戶信息
  async getUserInfo({commit}){
    const result = await getUserInfo(); // actions中調用getUserInfo方法---需要引入import
    console.log(result);
    if(result.success_code === 200){
       commit(USER_INFO, {userInfo: result.message});
    }
  },

　　actions中調用getUserInfo方法---需要引入

import {
  getUserInfo,
} from '../api'
----------------------
api-index.js

// 2.9 獲取登錄的用戶信息
export const getUserInfo = () => ajax(BASE_URL + '/api/user_info');