{“errMsg“:“setTabBarBadge:fail not TabBar page“}

需求:需要在购物车的tabbar上面添加一个数字角标 ,需要动态更新数字

问题描述:发现官网上有 uni.setTabBarBadge 这个方法可以设置角标,于是在商品详情页加入购物车之后调用下面这个方法

 
却发现报错了

根据提示发现,这个方法不能在tabbar以外的页面调用。
解决办法:
        1.在tabber页面onShow时候调用,因为有多个页面可以进商品详情,所以在每个最后返回的tabber页面都需要调用下设置角标方法,但是又因为这些东西都是可以复用的。

        2.将购物车数量放到仓库中(useCartStore),这里用了pinia 做状态管理
        

        3.定义了一个混入方法

        4.具体实现代码

        5.在购物车页面如果删除商品时需要调用一下这个方法去更新角标

        最后解决了这个问题。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值