需求:返回值里面有
0,1,2,3,4 分别代表面试,开会,拜访顾客,项目实施,其他这5中类型,需要将获取到的0,1,2,3,4渲染到页面上,分别显示所对应的类型状态面试,开会,拜访顾客,项目实施,其他。
json数据
将准备的json数据放在服务器上,可以方便调用
如果没有 自己的服务器,就准备掉后端的接口,或者直接存在本地的json文件里面,备用。
{ "msg": "查询成功", "total": 25, "code": 1, "rows": [{ "visitCause": 0 }, { "visitCause": 1 }, { "visitCause": 2 }, { "visitCause": 3 }, { "visitCause": 4 }, { "visitCause": 2 }, { "visitCause": 4 }] }
js
Page({ data: { list: [], }, onLoad: function(options) { wx.request({ url: "http://xxx.com/test.json", data: { }, method: 'GET', header: { 'content-type': 'application/json' }, success: res => { this.setData({ //第一个data为固定用法,第二个data是json中的data //list: res.data.rows list: (res.data.rows || []).map(a => { a.visitCause = a.visitCause === 0 ? '面试' : a.visitCause === 1 ? '开会' : a.visitCause === 2 ? '拜访顾客' : a.visitCause === 3 ? '项目实施' : '其他' return a }) }) } }) }, })
wxml
<!-- 所有列表 --> <view class="cu-item" wx:for="{{list}}" wx:key="index" catchtap="bindViewDetails" data-id="{{item.id}}"> <span>来访理由:{{item.visitCause}}</span> </view>
显示