赞
踩
看了好多篇解决问题的方法,都没有思考症结的所在。
究其原因是wx.switchTab运行机制问题。
1.wx.switchTab
是微信小程序中的一个页面跳转方法,通常用于切换到底部 TabBar 中的某个页面。它有以下特点:
只能跳转到 TabBar 页面:wx.switchTab
用于跳转到底部 TabBar 导航栏中的某个页面,因此只能用于跳转到在 app.json
中配置的 TabBar 页面。一般用于实现底部导航切换功能。
wx.switchTab()
通常情况下,当用户使用 wx.switchTab
方法切换到底部 TabBar 导航栏中的其他页面时,底部 TabBar 组件会重新加载并显示相应的页面,这会导致 TabBar 组件的状态被重置。
底部 TabBar 组件通常会在每次页面切换时重新渲染,因此页面切换后会重置 TabBar 的状态和内容。这包括重新高亮选定的 Tab,更新 TabBar 上的图标或文本等。
2.了解了这一点之后,对症下药,定义一个全局变量或者 wx.setStorageSync方法,两者皆可。
其目的是为了当前索引得以在重置之后保存。
- custom-tab-bar
-
- import handleList from './data';
-
- const app = getApp();
-
- const getDefaultData = () => ({
- active: 0,
- list: []
- });
-
- Component({
- data: getDefaultData(),
- methods: {
- onChange(event) {
-
- const curIndex = event.detail.value;
-
- //这一步 用 wx.setStorageSync('currentIndex', currentIndex);也可以
- app.globalData.currentIndex= curIndex;
-
- wx.switchTab({
- url: `/${this.data.list[curIndex].url}`,
- });
- },
- },
-
- ready: function () {
- this.setData({
- active: app.globalData.currentIndex,
- list: handleList(app.globalData.currentIndex)
- })
- }
- });
-
-
- app.js中
- App({
- globalData: {
- currentIndex: 0, // 初始状态为未登录
- },
- });
到此问题得以解决。
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。