vue store狀態存儲管理

1、引入vuex,使用store存儲，一般存儲於內存中，刷新頁面后會丟失。

　　用法：

import Vuex from 'vuex'

import config from '@/env/config';

Vue.use(Vuex)

export default new Vuex.Store({

    state: {

        deptName: '',

        title: '',

        word: ''

    },

    mutations: {

        //這里是set方法

        setDeptName(state, name) {

            state.deptName = name;

        }

    },

    actions: {

        setDeptName(context, name) {

            context.commit('setDeptName', name);

        }

    }

})

mutations 用於修改state內容的值，actions負責提交mutations

原則上 頁面通過 this.$store.dispatch("")來觸發對應的action，action里commit觸發mutations

2、引入vuex-along,實現存儲刷新不丟失，可以指定store內容存儲到localstorage或者sessionstorage中。 用法在 new store中添加plugins:[vuexAlong]，（該方式默認將store的state的所有內容存儲到localstorage或sessionstorage中）， 如果local和session 不配置，默認vuex-along存儲在localstorage中。

　　用法：

plugins: [VueXAlong({
    name: 'along',     //存放在localStroage或者sessionStroage 中的名字
    local:{ list: [], isFilter: false}, //isFilter 配置false,代表list里的對象存儲在localstorage中
    session: { list: [], isFilter: true } //isFilter設置為true時， list 數組中的值就會被過濾調,這些值不會存放在seesionstorage中
 })]