小程序之切换多种身份

1.当用户登陆的时候，把该账号注册过的身份保存到本地存储，假设这个用户注册了三种身份，分别是，身份A、身份B、身份C。

uni.setStorageSync('mainData', state.roleList);

2.当用户登录时，要默认展示该账号认证过的第一个身份，同样的也是保存到本地存储，这里取到身份数组的第一个做保存。

uni.setStorageSync('ShowIdentity', state.roleList[0]);

另外个人中心底部的常用功能区，根据不同的身份进行切换，这个时候就要判断，用户当前所在的身份。

由于本项目涉及的身份较多，所以底部个人中心区域我封装了单独的组件。

<FunctionalModule @clickModel="handleMoudle" v-if="ShowFlag"> </FunctionalModule>

 注意：此处给组件绑定一个v-if是为了必要时强制让组件重新挂载，任何自定义组件都可以这么操作，三行代码即可。

ShowFlag.value = false
	nextTick(() => {
		ShowFlag.value = true;
	})

至于在组件内部，如何动态的渲染个人中心的应用，我才用的方法是，在生命周期里面，先获取到当前用户所处的身份名，再根据对应的名字查找到module数组，这个数组里面包括icon，url，title这些数据。

onMounted(() => {
	let Showname = uni.getStorageSync('ShowIdentity')
	let obj = roleMapping.value.find(item => item.name === Showname);
	ModelList.value = obj.module;
});

	module: [{
			    title: '标题1',
				bgc: '#E6F0FF',
				icon: '../static/newImages/devIng.png'
			},
			{
				title: "标题2",
				bgc: '#FFE1E2',
				icon: '../static/newImages/devIng.png'
			},
			{
				title: "邀标题3",
				bgc: '#FFF7DE',
				icon: '../static/newImages/devIng.png'
			}
		]

 还有一点补充说明，就是如何判断当前用户是不是认证过该身份，如果没认证过那就部允许点击个人底部的目录，关于这个功能也很简单。只需要判断用户选择的身份是不是在之前保存到本地存储的数组里面就好,如果未认证，那头部将会有未认证标识。

//判断用户当前选择的身份是否是认证过的
flagIdentity.value = uni.getStorageSync('mainData').includes(uni.getStorageSync('ShowIdentity'));