uni-app微信小程序保持登录状态(vuex和本地存储)

uni-app全局变量实现方式：见文档。

方式多种多样，在这里我只对vuex和uni.setStorageSync进行说明。

方式一 ：vuex
1.在项目的根目录下创建文件‘store’，并在‘store’中新建index.js（名称随意起）如下：

说明：可以在state中定义你需要的值，需要注意的是‘hasLogin’如果你需要强制用户登录，只需要在需要判断的地方获取hasLogin的值来做不同处理即可！

2把.Vuex挂载到main.js上，如下图：

挂载以后你可以通过this.$store.state.hasLogin获取值。

3.在需要使用的页面引入

说明：computed中的值可以直接通过this.hasLogin获取值。

在登录成功后获取到服务器返回的数据将数据保存在全局变量中.如下图:

4.最后在app.vue中判断是否登录，如果登录就更新全局变量达到保持登录状态效果.

整体流程：在需要登录的界面使用this.$store.state.hasLogin判断是否登录，没有登录就跳转登录页面。，当第二次登录的时候会在app.vue中判断是否登录过 如果没有你就可以开始你的表演了，(比如写个while(true)啥的，先让用户手机卡机看看当地警察的分布再说)。开玩笑，当然是写你想做的事了.比如跳转登录，或者跳转首页等操作!

方式二：利用setStorage进行本地存储方式.

这种方式就显得比较简单易懂了，当用户登录成功后你接收到服务器返回的数据后利用uni.setStorageSync进行本地存储即可,用户退出登录的时候需要uni.clearStorageSync。
在需要登录才能查看的页面调用如下图的方法(声明在main.js)：

方式一和方式二的区别：
方式一利用vuex来管理全局变量达到效果，方式二通过本地存储以及获取本地存储来确认是否有登录，心细的朋友都发现了 即便方式一最后还是通过setStorage保存的数据，其实这两种方式都可以使用，不同的区别在于方式一获取的是一个变量的值，方式二你需要在使用的地方获取一次本地缓存，性能方面我不是很了解 但是肯定会有所差异的，作为一个渣渣 这个我不配了解。

项目中建议方式一，因为毕竟是官方推荐的，当然使用方式二也没什么问题。