定义状态管理器：首先要在main.js中注册store
import Vue from 'vue'
import App from './App.vue'
import './registerServiceWorker'
import router from './router'
import store from './store'
Vue.config.productionTip = false
new Vue({
router,
store,
render: h => h(App)
}).$mount('#app')
// src/store/index.js 定义状态
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
export default new Vuex.Store({
state: {
// 共享的状态
// 页面刷新，状态管理器的状态会重置 ---- 需求 ---- 保留
loginState: localStorage.getItem('loginState') === 'true' || false
},
mutations: { // 唯一改变数据的方式就是显示的提交mutation （提交-组件/actions）
changeLoginState (state, data) {
state.loginState = data
}
}
})
登录时保存状态（把true保存到状态管理器）
登录状态
底部组件获得登录状态
使用$store获取
退出登录 点击退出登录，把false保存到状态管理器，把localStorage清空，然后跳转到登录界面
退出登录
