- 需求的场景描述（希望解决的问题）
现在我们小程序有一个「首页」、「我的」、「发帖」tab，其中「我的」、「发帖」都需要用户登录后才能进行操作，之前我们是在这两个页面直接调 wx.getUserInfo 强制用户进行登录
但为了响应 获取用户信息接口优化调整，我们新加了个「登录页」，然后在「我的」、「发帖」判断用户登录态，若未登录，使用 wx.navigateTo 重定向到这个「登录页」
然后，现在碰到的问题是，在「我的」、「发帖」进行跳转到「登录页」时，页面会【闪烁】下，用户体验非常不好
- 希望提供的能力
希望可以在 onTabItemTap 能改变 tabBar 配置里的跳转地址。伪代码如下：
onTabItemTap (item) { const { pagePath } = item const needAuthPaths = [ '/page/my/index', '/page/post/index' ]
// 方案1. 使用 wx.navigateTo 进行跳转 if (needAuthPaths.indexOf(pagePath) !== -1 && !this.loginState) { wx.navigateTo({ url: '/page/login/index' }) return false
} |
登入页写成一个组件，然后写一个进入动画。需要的页面调用组件就会体验友好些。改写tap路由感觉比较危险
可以考虑在需要用户登录的页面中操作时，进行登录操作。
我的做法是在这些页面进行判断是否已经登录，没有登录的话会放一个全页面大小的fixed定位的opacity为0的open-type为getUserInfo的按钮，当有点击事件，就可以触发绑定的授权事件
<buttonwx:if='{{!hasUserInfo}}'class='whole-button'open-type='getUserInfo'bindgetuserinfo='getUserInfo'plain='true'></button>.whole-button {position:fixed;z-index:9999;top:0;bottom:0;left:0;right:0;opacity:0;}