环境如下:
ios微信8.0.69
自定义tabbar(tabBar.custom: true),
所有的二级页面都在一个分包中,
现象如下:
当小程序第一次加载后,我点击某个二级页面(此时下载分包),等待分包加载完成页面渲染完成后,然后我返回首页,点击自定义的tabbar,此时页面切过去了,但是tabbar的高亮状态还是首页。
如果我开启预下载分包,在vconsole中看到分包下载完成,等下载完后我再访问二级页面,这个时候再返回到首页,再点击其他的tabbar页面可以正常切换,高亮也正常,请问可能的原因是啥,如何解决呢?
---- ios微信更新前版本是8.0.63,在8.0.63中表现是好的 ---
核心代码:
export default function CustomTabBar() {
// userTabBarStore 是 一个全局状态管理(zustand),存储了tabBarList和activeTabBar等信息
const { activeTabBar, tabBarList, setActiveTabBar } = userTabBarStore()
useEffect(() => {
const pages = Taro.getCurrentPages()
const currentPage = pages[pages.length - 1]?.route
const index = tabBarList?.findIndex((item) => item.pagePath.includes(currentPage || '')) ?? -1
if (index > -1) setActiveTabBar(index)
}, [])
// 切换 Tab
const switchTab = (item, index) => {
setActiveTabBar(index)
}
return (
<View className='custom-tab-bar'>
{tabBarList?.map((item, index) => (
<View
key={index}
className={`tab-item ${activeTabBar === index ? 'active' : ''}`}
onClick={() => switchTab(item, index)}
>
<Image
src={(activeTabBar === index ? item?.selectedIconPath : item?.iconPath) || ''}
className='tab-icon'
/>
<View className='tab-text' style={{ color: activeTabBar === index ? '#FF761E' : '' }}>
{item.text}
</View>
</View>
))}
</View>
)
}
另外写了一个hook,在tabbar的页面中都引入了
// 自定义tabBarhooks
export const useHandleTabBarHook = (tabNum?: number) => {
const { tabBarList, setActiveTabBar } = userTabBarStore()
useDidShow(() => {
if (tabNum !== undefined) {
setActiveTabBar(tabNum)
return
}
const pages = Taro.getCurrentPages() // 获取当前页面栈
const currentPage = pages[pages.length - 1] // 获取当前页面
const route = currentPage?.route || currentPage?.__displayReporter?.pagePath // 当前页面路径
const index = tabBarList?.findIndex((item) => item?.pagePath?.includes(route || '')) ?? -1
if (index > -1) setActiveTabBar(index)
})
}

各位大佬的小程序有同时用自定义tabbar和分包的,找个苹果手机更新一下微信到8.0.69,应该会复现这个问题!!!