首页
技术小册
AIGC
面试刷题
技术文章
MAGENTO
云计算
视频课程
源码下载
PDF书籍
「涨薪秘籍」
登录
注册
uni-app介绍
创建uni-app项目
uni-app文件介绍
运行到微发者工具
引入官方css样式库2
引入自定义图标库
引入animate.css
设置全局样式
底部导航开发
当前位置:
首页>>
技术小册>>
uni-app零基础入门
小册名称：uni-app零基础入门
### 底部导航配置 如果应用是一个多 tab 应用，可以通过 tabBar 配置项指定一级导航栏，以及 tab 切换时显示的对应页。 在 pages.json 中提供 tabBar 配置，不仅仅是为了方便快速开发导航，更重要的是在App和小程序端提升性能。在这两个平台，底层原生引擎在启动时无需等待js引擎初始化，即可直接读取 pages.json 中配置的 tabBar 信息，渲染原生tab。 ### 参考文档地址： https://uniapp.dcloud.net.cn/collocation/pages.html#tabbar  ### 测试 pages.json，添加tabBar： ```bash "tabBar": { "color": "#7A7E83", "selectedColor": "#007AFF", "borderStyle": "black", "backgroundColor": "#F8F8F8", "list": [{ "pagePath": "pages/index/index", "iconPath": "static/component.png", "selectedIconPath": "static/componentHL.png", "text": "内置组件" }, { "pagePath": "pages/list/list", "iconPath": "static/api.png", "selectedIconPath": "static/apiHL.png", "text": "接口" } ] } ``` 这里我们就设置两个页面，index 和list  这里我们方便测试，就使用了之前复制的hello uniapp项目里的图标，可以参照前面小节介绍的阿里图标，下载对应的png图标，进行替换
上一篇：
设置全局样式
该分类下的相关小册推荐：
uniapp入门教程
