小程序根据返回值的int类型渲染不同的状态

需求:返回值里面有
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>
	

显示

在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值