微信小程序开发,使用微信开发者工具。现在js页有filteredDataArray数组如下{ date: currentDate, avenues: { "自然来访": 0, "转介": 0, "自拓": 0, "电call": 0, "老客户": 0, }, dataCount: 0 };现在需要再wxml页面使用wx:for循环渲染avenues内的属性,可以怎么绑定数据?
时间: 2024-02-14 21:11:21 浏览: 111
你可以使用wx:for循环遍历filteredDataArray数组,然后在每次遍历时使用wx:key指定一个唯一的键值,最后在wx:for循环内部使用{{}}绑定avenues内的属性名和属性值即可。具体的代码示例如下:
```html
<view wx:for="{{filteredDataArray}}" wx:key="{{index}}">
<view wx:for="{{item.avenues}}" wx:key="{{index}}">
<text>{{index}}: {{item.avenues[index]}}</text>
</view>
</view>
```
在上面的代码中,我们首先使用wx:for循环遍历filteredDataArray数组,然后在每次遍历时使用{{item.avenues}}获取avenues对象。接着,我们再使用wx:for循环遍历avenues对象,使用{{index}}获取属性名,使用item.avenues[index]获取属性值。最后,在wx:for循环内部使用text标签来显示属性名和属性值。
相关问题
微信小程序开发,wxml页面双花括号 {{}}不能写中文,但是wx:for的item项就是中文要怎么操作[ { "date": "2023-05-08", "avenues": { "自然来访": 159, "转介": 71, "自拓": 3, "电call": 0, "老客户": 0 }, "dataCount": 233, "周蕾": { "自然来访": 32, "转介": 3, "自拓": 0, "电call": 0, "老客户": 0 }, }, { date: currentDate, avenues: { "自然来访": 0, "转介": 0, "自拓": 0, "电call": 0, "老客户": 0, }, dataCount: 0, "": { } }, { date: currentDate, avenues: { "自然来访": 0, "转介": 0, "自拓": 0, "电call": 0, "老客户": 0, }, dataCount: 0, "黄美华": { "自然来访": 22, "转介": 13, "自拓": 0, "电call": 0, "老客户": 0 }, "张巧儿": { "自然来访": 39, "转介": 14, "自拓": 0, "电call": 0, "老客户": 0 }, "雷丽": { "自然来访": 28, "转介": 25, "自拓": 0, "电call": 0, "老客户": 0 }, "石秀": { "自然来访": 38, "转介": 16, "自拓": 3, "电call": 0, "老客户": 0 }]
可以使用中文作为wx:for的item项,但是在wxml页面中使用数据绑定时,需要将中文转换成对应的变量名或属性名。比如你可以将"黄美华"转换成"huanmeihua",然后在wxml页面中使用双花括号绑定数据时,就可以用"huanmeihua"来代替中文了。具体代码实现如下:
```
<view wx:for="{{ filteredDataArray }}" wx:key="{{ index }}">
<view>{{ item.date }}</view>
<view wx:for="{{ item.avenues }}" wx:key="{{ key }}">
<view>{{ key }}: {{ item.avenues[key] }}</view>
</view>
<view>{{ item.dataCount }}</view>
<view>{{ item['周蕾'].自然来访 }}</view>
<view>{{ item['黄美华'].转介 }}</view>
<view>{{ item['张巧儿'].自拓 }}</view>
<view>{{ item['雷丽'].电call }}</view>
<view>{{ item['石秀'].老客户 }}</view>
</view>
```
在上面的代码中,我使用了item['周蕾'].自然来访来代替双花括号中的中文,这样就可以正常绑定数据了。
微信小程序开发者工具分别将当前日期和时间赋值给变量的代码
将当前日期赋值给变量的代码:
```javascript
var date = new Date();
var year = date.getFullYear(); //获取完整的年份(4位)
var month = date.getMonth() + 1; //获取当前月份(0-11,0代表1月)
var day = date.getDate(); //获取当前日(1-31)
var currentDate = year + "-" + month + "-" + day; //将日期拼接成字符串
console.log(currentDate); //控制台输出当前日期
```
将当前时间赋值给变量的代码:
```javascript
var date = new Date();
var hour = date.getHours(); //获取当前小时数(0-23)
var minute = date.getMinutes(); //获取当前分钟数(0-59)
var second = date.getSeconds(); //获取当前秒数(0-59)
var currentTime = hour + ":" + minute + ":" + second; //将时间拼接成字符串
console.log(currentTime); //控制台输出当前时间
```
以上代码将当前日期和时间分别拼接成了字符串并赋值给了 `currentDate` 和 `currentTime` 变量。你可以根据具体需求修改拼接的格式。
阅读全文