首页 - 新闻 - 如何在uniapp中显示tabbar

如何在uniapp中显示tabbar

2023-10-06 20:59

如何在uniapp中显示tabbar:首先,pages数组中的第一项代表应用程序启动页面;然后在[page.js]文件中进行配置,代码为["path" : "pages/show/ show","style" : {"navigationBarT].

{ "pages": [ //pages 数组中的第一项代表应用程序启动页面。 { “路径”:“页面/索引/索引”, “风格”: { "navigationBarTitleText": "uni-app" } } ,{ "路径" : "页面/显示/显示", “风格” : { "navigationBarTitleText": "显示" } } ,{ "path" : "页面/组件/组件", “风格” : { "navigationBarTitleText": "组件" } } ], “全局样式”:{ "navigationBarTextStyle": "黑色", "navigationBarTitleText": "uni-app", "navigationBarBackgroundColor": "#F8F8F8", “背景颜色”:“#F8F8F8” }, “标签栏”:{ “颜色”:“#F0AD4E”, "选定的颜色": "#3cc51f", “边框样式”:“黑色”, "背景颜色": "#F8F8F8", “列表”: [{"pagePath": "页面/索引/索引", "iconPath": "静态/logo.png", "selectedIconPath": "static/logo.png", “文本”:“首页” },{ "pagePath": "页面/组件/组件", "iconPath": "静态/logo.png", "selectedIconPath": "static/logo.png", “文本”:“组件” }, { "pagePath": "页面/显示/显示", "iconPath": "静态/logo.png", "selectedIconPath": "static/logo.png", “文本”:“显示” }] } }

登录后复制

一开始我不知道为什么在“tabBar”中配置了两个页面时不显示。配置了三个页面后,就成功了。不知道你是否遇到过这个问题

好的,配置成功,效果图如下

以上就是uniapp中如何显示tabbar的详细内容。请关注其他相关文章以获取更多信息!