Uniapp 底部导航栏 自定义 tabBar 全端 全页面引用跳转 组件

平台兼容性

Vue2 Vue3
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 3.1.0 app-vue app-nvue
钉钉小程序 快手小程序 飞书小程序 京东小程序
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari

Uniapp 底部导航栏 自定义 tabBar 全端 全页面引用跳转 组件_第1张图片

使用教程

第一步

引入组件


第二步

将给zhi赋值进行传送给组件

备注:zhi按照底部按钮对应的页面中填写该按钮的索引(从0开始)


第三步

在uni_modules/TC-tabBar/components/TC-tabBar/TC-tabBar中自行修改自己对应的页面路径

Uniapp 底部导航栏 自定义 tabBar 全端 全页面引用跳转 组件_第2张图片

部分代码

Uniapp 底部导航栏 自定义 tabBar 全端 全页面引用跳转 组件_第3张图片

Uniapp 底部导航栏 自定义 tabBar 全端 全页面引用跳转 组件_第4张图片

链接:TC-tabBar 底部导航栏 自定义 tabBar 全端 全页面引用跳转 组件 - DCloud 插件市场

 

如有什么疑问可添加以下微信名片

你可能感兴趣的:(uniapp,uni-app,前端,vue,javascript,程序人生)