找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索本站精品资源

首页 教程频道 小程序开发 查看内容

TITF:tabBar的使用小技巧(附数据绑定一个对象到数组中,然后取值的一个注意

作者:模板之家 2018-1-29 10:06 9186人关注

本文来自公众号:TITF 一:tabBar的使用小技巧 原理:在app.json中配置tabBar属性 3、关键代码 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 tabBar: { color:#666666, selectedColor:#06bd04, list: [{ pagePath: index, t ...

本文来自公众号:TITF
一:tabBar的使用小技巧

原理:在app.json中配置tabBar属性

3、关键代码

 

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15

											
"tabBar": {
"color":"#666666",
"selectedColor":"#06bd04",
"list": [{
"pagePath": "index",
"text": "首页",
"iconPath": "images/index.png",
"selectedIconPath": "images/indexHL.png"
},{
"pagePath": "picDisplay",
"text": "图片展示",
"iconPath": "images/picDisplay.png",
"selectedIconPath": "images/picDisplayHL.png"
}]
}
 来自CODE的代码片
snippet_file_0.txt

 

4、操作方法

 

  • 新建一个项目,打开app.json文件,将关键代码复制到"window":{},后面,注意window的大括号前加逗号,如下图

 

 

  • 配置tabBar属性值
  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22

											
"tabBar": {
//设置tabBar文字默认颜色
"color":"#666666",
//设置tabBar文字被选中是的颜色
"selectedColor":"#06bd04",
//tab列表,数组类型,改数组内至少要有两个但不大于5个的tab对象
"list": [{
//设置tab跳转页面链接
"pagePath": "index",
//设置tab上的文字
"text": "首页",
//设置tab上的默认图标
"iconPath": "images/index.png",
//设置tab被选中时的图标
"selectedIconPath": "images/indexHL.png"
},{
"pagePath": "picDisplay",
"text": "图片展示",
"iconPath": "images/picDisplay.png",
"selectedIconPath": "images/picDisplayHL.png"
}]
}
二:数据绑定一个对象到数组中,然后取值的一个注意点(分享者:guonei001)

通过wx.request获取到服务器数据之后将数据(一个json对象)绑定至post数组,然后页面中获取数据的时候可以直接通过(数组名.属性)直接取值。数组中有多个json对象的话,则需要wx:for遍历取值。

 

单个json对象数据绑定

页面取值:



路过

雷人

握手

鲜花

鸡蛋
原作者: 模板之家 来自: 网络收集

全部回复(0)