tabBar 为app.json设置项,设置导航属性,详细api请点击:[链接](https://developers.weixin.qq.com/miniprogram/dev/api/ui/tab-bar/wx.setTabBarItem.html?search-key=tabbar)
~~~
{
"pages": [
"pages/index/index",
"pages/movie/movie",
"pages/movie-detail/movie-detail"
],
"tabBar": {
"color": "#666",
"selectedColor": "#3785F9",
"position": "bottom",
"borderStyle": "black",
"list": [
{
"pagePath": "pages/index/index",
"text": "text1",
"iconPath": "iconPath",
"selectedIconPath": "selectedIconPath"
},
{
"pagePath": "pages/movie-detail/movie-detail",
"text": "text2",
"iconPath": "iconPath",
"selectedIconPath": "selectedIconPath"
}
]
}
}
~~~
* tabBar 指导航配置属性
* color 未选择时底部导航文字的颜色
* selectedColor 选择时底部导航文字的颜色
* borderStyle 底部导航边框的样色(注意:这里如果没有写入样式 会导致导航框上边框会出现默认的浅灰色线条)
* list 导航配置数组
* selectedIconPath 选中时图标路径
* iconPath 未选择时图标路径
* pagePath 页面访问地址
* text 导航图标下方文字
> **tobBar下list数组中的排列先后与页面创建时的排列先后顺序一致,且第一个必须为想要看到的页面(像上例中的index必须在第一个位置,不然第一个显示的为页面创建时的第一个)**
- 小程序环境配置
- 1.生命周期
- 页面生命周期
- 组件生命周期
- 2.小程序组件
- 点击事件bindtap|catchtap
- swiper轮播
- wx:for循环
- 播放音乐
- map
- tabBar底部页面切换
- scroll-view可滚动视图区域。
- web-view装载显示网页
- priviewImage新页面预览照片
- chooseImage本地选择照片
- onReachBottom上拉刷新,加载等待条
- setStorage缓存
- showToast弹出提示框
- slot父组件wxml传递到子组件
- form表单
- 小程序.wxs,方法在.wxml调用
- 3.组件前身:模板、模板传参
- 4.自定义组件、组件传参|传wxss|wxml代码
- 5.小程序正则
- 6.小程序页面跳转
- 7.open-type 微信开放功能
- 实例
- 1.第一个实例 hello world
- 2.第二个实例豆瓣电影数据渲染
- 豆瓣1.0基本版
- 豆瓣2.0升级版
- 豆瓣3.0豪华版
- 3.第三个实例多接口在同一页面使用
- HTTP封装
- 基础报错提示,类式封装
- Promise回调,类式封装