【Vue】以登录token为例，理解vuex状态管理使用

一、Vuex概念

       Vue.js通过Vuex对组件的公共状态进行集中管理。每一个 Vuex 应用的核心是 store（仓库），“store”可以理解为是一个容器，包含着应用中大部分的状态 (state)。这些状态是全局的，但Vuex 和单纯的全局对象有以下两点不同：

    ① Vuex 的状态存储是响应式的。 Vue 组件从 store 中读取状态时，若 store 中的状态发生变化，那么相应的组件也会更新。

    ② 不能直接改变 store 中的状态。改变store中状态的唯一途径是显示地提交mutation。

二、网站登录状态保持例子

业务流程：

用户通过网页表单提交用户名和密码，后台根据提交的数据生成token，与数据库进行匹配，并给前端返回信息。

前端调用vuex的changeLogin方法将后台返回的token数据保存到localstorage中，并更新store中state的Authorization。

代码如下：

login.vue