Uni-app登陆态管理（vuex）

应用中，保持登陆状态是常见需求，本文讲解使用uni-app框架时如何保持用户登陆状态。

即：初次进入应用为未登陆状态------->登陆---------->关闭应用，再次打开--------->为已登陆状态

传统应用保持登陆状态的方式是经过读取 cookie 来判断是不是登陆状态，可是uni-app不支持对cookie的读写。由于uni-app框架的主体是 VUE，因此能够使用  vuex  进行登陆态管理。

 关于vuex中定义的全局变量和方法须要定义在指定目录的文件内。

即在项目目录下新建名称为  store  的目录，目录下建立用于定义全局变量和方法的  js  文件，以下图：

  index.js文件内容以下图所示：

想要定义的这个 js 文件中的变量和方法能在各个页面使用并生效，须要先在项目目录下的  main.js  文件中导入这个  js  文件并声明方法，以下图所示：

声明结束后就能够在页面中监控全局变量和相应方法了，下面在一个登陆页面中具体展现。

先在页面导入vuex的方法，以下：

而后，在 computed 计算属性方法中使用  mapState 对全局变量进行监控，在 method中使用  mapMutations  进行全局方法监控，以下所示：

定义登陆成功后跳转到我的中心的函数，以下：

网络请求成功后，在回调函数 success 中调用该方法，并把回调函数的返回值数据传给 login 方法，以下：

随后  index.js  文件中的login方法会把传过来的用户数据保存在本地缓存中。

app没等进入应用时由APP.vue文件中的周期函数对app进行监听，因此在加载函数中定义方法，从本地缓存中取出用户数据进行登陆，这样只要不清除本地缓存，每次打开应用的时候都会时登陆状态，不须要反复发起网络登陆请求，以下：