//无渲染数据页面
<view class="profile-banner profile-banner-order">
<view
class="pb-item pb-item-order"
v-for="(item, index) in data.items"
:key="index"
@tap="goPage(item.url)"
>
<image
:src="item.img"
mode="aspectFit"
style="width: 92rpx; height: 92rpx"
></image>
<text class="text">{{ item.name }}</text>
<text class="tips" v-if="item.num > 0">{{ item.num }}</text>
</view>
</view>
const data = reactive({
nearbyFarm: [],
items: [
{
name: "商城订单",
url: "/pagesComm/profile/order?type=shop",
num: 0,
img: shopOrder,
},
{
name: "1订单",
url: "/pagesComm/profile/order?type=rz",
num: 0,
img: rzOrder,
},
],
])
//tabbar
<template v-slot:gFooter>
<view class="footer">
<view
class="footer-item"
v-for="(item, index) in data.bottomTools"
:key="index"
@tap="urlJump(item)"
>
<image
:src="
$App.ossImage(
item.name === '我的' ? item.focusIcon : item.icon
)
"
class="footer-item-image"
:style="item.scale ? `transform: scale(${item.scale})` : ''"
></image>
<view
class="footer-item-name"
:style="
item.name === '我的' ? 'color: #906A43;font-weight: bold' : ''
"
>{{ item.name }}</view
>
</view>
</view>
</template>
const urlJump = (item: axj.DtDTools) => {
//这里只做页面跳转,数据都是写死的
};
- 发布:2023-09-19 09:51
- 更新:2023-09-19 13:46
- 阅读:373
产品分类: uniapp/小程序/字节跳动
PC开发环境操作系统: Windows
PC开发环境操作系统版本号: 10
HBuilderX类型: 正式
HBuilderX版本号: 3.6.18
第三方开发者工具版本号: 4.1.3
基础库版本号: 2.95.0.1
项目创建方式: HBuilderX
示例代码:
操作步骤:
扫码 体验版打开,反复切换tabbar
扫码 体验版打开,反复切换tabbar
预期结果:
正常切换
正常切换
实际结果:
不能切换,或者页面不渲染
不能切换,或者页面不渲染
bug描述:
自定义了一个tabbar组件,iphone8 抖音极速版 扫码体验版 点击tabbar切换页面
本地真机没有此问题,安卓没有测出这个问题
1、用uni.navigateTo跳转,多次跳转后,页面卡住,不能再点击切换按钮(详见录屏视频)
2、改用uni.redirectTo和uni.reLaunch,页面多次切换页面不渲染,渲染数据是静态资源全是写死的(看图片截图)
z***@163.com - 御风
tabbar 跳转一般是用 uni.switchTab,如果只是一个 tabbar效果,而非真实的tabbar(页面的一个最底部导航组件),渲染方式可以换一种思路,比如把数据存储在vuex中,如果请求了不在刷新,这样是否可以实现
zhangrl (作者)
自定义tabbar ,页面本事就是静态数据,没有涉及接口请求的
2023-09-19 11:17