• 使用uniapp设置tabbar的角标和移除tabbar的角标

    使用场景描述

    在一进入到小程序的时候就要将用户在购物车中添加的商品总数，要以角标的形式显示在tababr中。

    代码实现

    1. //index.vue
    2.

    由于一进入到小程序的时候最先展示的为index.vue所以我在这个文件中设置的。

    效果展示

     

    uni.setTabBarBadge(OBJECT)介绍

    作用

     为tabBar某一项的右上角添加文本。

    平台差异

    AppH5

    微信小程序

    支付宝

    小程序

    百度

    小程序

    		抖音小程序
    飞书小程序    		QQ小程序快手小程序京东小程序
    √√√√√√√√√

    OBJECT参数说明

    参数类型必填说明
    indexNumber√tabBar的哪一项，从左边算起，从0开始
    textString√显示的文本，不超过3个半角字符
    successFunction×接口调用成功的回调函数
    failFunction×接口调用失败的回调函数
    completeFunction×接口调用结束的回调函数（成功、失败都会执行）

    uni.removeTabBarBadge(OBJECT)介绍

    作用

    移除tabBar某一项右上角的文本。

    平台差异说明

    OBJECT参数说明

    参数类型必填说明
    indexNumber√tabBar的哪一项，从左边算起，从0开始
    successFunction×接口调用成功的回调函数
    failFunction×接口调用失败的回调函数
    completeFunction×接口调用结束的回调函数（成功、失败都会执行）

  • 相关阅读:
    如何通过低代码平台搭建以“督办”为中心的办公管理系统
    Java面试题之初入Java世界
    docker.6-Dockerfile精讲及新型容器镜像构建技术
    springboot毕设项目宠物商城系统的设计与实现pcz03（java+VUE+Mybatis+Maven+Mysql）
    排序-表排序
    1.0、C语言——初识C语言
    单例模式（饱汉式和饿汉式）
    在旋转过的有序数组中寻找目标值
    免费在线pdf处理工具：pdf文件压缩；pdf文件转word
    机器学习面试中常见问题整理
  • 原文地址：https://blog.csdn.net/qq_45569925/article/details/139613279