当前位置: 首页 > news >正文

uniapp自定义tabbar,根据角色动态显示不同tabbar,无闪动问题

🤵 作者coderYYY
🧑 个人简介:前端程序媛,目前主攻web前端,后端辅助,其他技术知识也会偶尔分享🍀欢迎和我一起交流!🚀(评论和私信一般会回!!)
👉 个人专栏推荐:《前端项目教程以及代码》

✨一、前言

这个需求在开发中还是很常见的,搜索了网络其他教程,要么太复杂要么有bug,或是没有完整代码,自己摸索实现了一个,目前没有发现bug,试了h5和微信小程序都没问题,代码算比较简洁

🚩二、具体实现

🎉1. 新建CustomTabBar组件

这里用uView的组件,当然也可以自己写一个

<template>
  <u-tabbar
    :value="current"
    @change="handleTabChange"
    :fixed="true"
    :placeholder="true"
    :safeAreaInsetBottom="true"
  >
    <u-tabbar-item
      v-for="(item, index) in tabList"
      :key="index"
      :text="item.text"
      :icon="item.icon

相关文章:

  • 微服务架构介绍
  • 搭建springboot框架建立项目流程(后端开发)
  • 60. 评论日记
  • 深入理解Java中的队列:核心操作、实现与应用
  • Linux网络管理
  • SAP系统中的借货
  • UE5 物理模拟 与 触发检测
  • 通信原理-非线性调制
  • SQL(10):约束:NOT NULL
  • M-7J1R ROSAHL 全球唯一电解方式除湿/加湿器
  • 若依代码生成器原理velocity模板引擎(自用)
  • 【Cry for me】歌词翻译
  • Python----机器学习(基于PyTorch的垃圾邮件逻辑回归)
  • 活动安排问题 之 前缀和与差分
  • FreeRTOS之任务管理
  • Linux系统常见磁盘扩容操作(Common Disk Expansion Operations in Linux Systems)
  • Ant Design Vue 表格复杂数据合并单元格
  • 从自动测量、8D响应到供应链协同的全链路质量管理数字化方案——全星QMS如何破解汽车行业质量困局
  • AI技术前沿:蓝耘元生代智算云快速入门教程详解,与其他云人工智能大模型深度对比
  • AI幻觉的生成原理与应对指南:六大中文模型横向解析
  • 商务部:入境消费增长潜力巨大,离境退税有助降低境外旅客购物成本
  • 同款瑞幸咖啡竟差了6元,开了会员仍比别人贵!客服回应
  • 经济日报:AI时代如何寻找“你的赛道”
  • 吏亦有道|秦汉的发明家与技术传承
  • “2025上海西九文化周”启动,香港顶尖文艺6月齐聚申城
  • 陕西省烹饪餐饮行业领军人物黄建军逝世,终年53岁