解决思路
在应用首次加载时,依次调用switchTab预加载dom
1、在App.vue的onLaunch中加入跳转页面
注意:首页放最后
onLaunch: async function() {
const pages = ['页面1', '页面2', '页面3','首页'];
for (let i = 0; i < pages.length; i++) {
try {
await new Promise((resolve, reject) => {
uni.switchTab({
url: pages[i],
success: () => {
resolve();
},
fail: () => {
reject();
}
});
});
} catch (error) {
console.error('Failed to switch tabbar page:', pages[i]);
}
if(i===pages.length-1){
this.$store.commit('setIsOkSwichTab',true)
}
}
},
2、在每个页面通过store的全局变量判断是否显示
用v-show判断为true时才显示,这样做是为了更快的进入首页,switchTab时,在onLoad尽量少做耗时操作
App实测可行,如果有更好的方案可以分享分享,其实看了还有些解决方案
1、共用同一个tabbar主页,通过v-if来控制各个页面,会有回到顶部的问题,每次切换都会回到顶部,用v-show的话卡,多个页面公用一个容器,除非再引入组件来控制高度
2、通过uni-simple-router,动态路由控制,感觉相对麻烦点,不过效果应该会好点,类似vue的router-view显示了,没用过
3、依次通过switchTab加载tabBar,这样就想自动帮用户都点了一下tabbar了,会延长APP应用启动时间
4、uni.preloadPage,预加载页面,我用的时候就是H5端可以,到实体机APP就不行了,可能版本问题
5、还有一种是,类似微信那样,直接四个页面都展示,还可以左右滑动,用swiper-item来做,类似轮播图,就是四个页面都展示了,问题就是加载东西多会卡卡卡
大概能找到的和想到的就这些了,坑坑坑啊
0 个评论
要回复文章请先登录或注册