第三章：⼩程序底部导航栏的实现（详细）⼩程序底部导航栏的实现
⼀. 下载图标
下载⾃⼰需要⽤到的图标, 例如⾸页 , 搜索 ,⽤户头像 等⼀些常⽤的图标，点击下载保存到本地就可以啦
⼆.新建images⽂件
在项⽬⽬录中新建⼀个images⽂件夹，把下载好的图标放在⽂件夹⾥⾯，命名保存
三.添加配置⽂件
在项⽬中到配置⽂件 app.json , 并 加⼊如下配置信息:
"tabBar": {
"color": "#a9b7b7",
"selectedColor": "#11cd6e",
"borderStyle": "white",
"list": [
{selectediconpath什么意思
"selectedIconPath": "images/⾸页.png",
"iconPath": "images/⾸页.png",
"pagePath": "pages/index/index",
"text": "⾸页"
},
{
"selectedIconPath": "images/组.png",
"iconPath": "images/组.png",
"pagePath": "pages/logs/logs",
"text": "⽇志"
},
{
"selectedIconPath": "images/信封.png",
"iconPath": "images/信封.png",
"pagePath": "pages/test/test",
"text": "测试"
}
]
},
app.json解释:
主要⽤来对⼩程序进⾏全局配置，决定页⾯⽂件的路径、窗⼝表现、设置⽹络超时时间、设置多 tab 等。
OK，编译, 我们可以看到底部导航效果完美实现~

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。