uniapp将底部导航组件化的方法：首先在pages目录下创建页面；然后制作导航图标；最后在【pages.json】文件下配置tabbar。
本教程操作环境：windows7系统、uni-app2.5.1版本，dell g3电脑。
推荐（免费）：uni-app开发教程
uniapp将底部导航组件化的方法：
tabbar参数说明
color：导航栏字体颜色
selectedcolor：选中后字体的颜色
backgroundcolor：底部背景颜色
borderstyle：底部的border颜色，只能是“black”或者“white”
list：对象，包含以下这些选项
{pagepath：页面路径text：底部导航文字iconpath：没选中前的图标路径selectediconpath：选中后的图标路径}
第一步：在pages目录下创建页面
这是创建的目录和页面名称（仅供参考）
第二步：制作导航图标
（1）打开阿里巴巴矢量图标库（iconfont）
（2）找到合适的图标加入购物车
（3）选择合适的颜色和格式下载即可
第三步：在pages.json文件下配置tabbar
{ "pages":[ ... ], "tabbar": {"color":"#8a8a8a","selectedcolor":"#00aa00","borderstyle":"black","backgroundcolor":"#ffffff","list": [{"pagepath":"pages/index/index","text":"首页","iconpath":"static/home_normal.png","selectediconpath":"static/home.png"},{"pagepath":"pages/search/search","text":"发现","iconpath":"static/search_normal.png","selectediconpath":"static/search.png"},{"pagepath":"pages/me/me","text":"我的","iconpath":"static/me_normal.png","selectediconpath":"static/me.png"}]}, "globalstyle": {...}}
效果展示
相关免费学习推荐：编程视频
以上就是uniapp如何将底部导航组件化的详细内容。