摘要：起因意图是想实现类似于安卓那样的效果，想到了用微信小程序的组件，但如果每个里都只用一个来渲染数据的话实在是太慢了，就想到多层嵌套数据渲染来提高效率。
起因：意图是想实现类似于安卓viewpager那样的效果，想到了用微信小程序的swiper组件，但如果每个swiper-item里都只用一个wx:for来渲染数据的话实在是太慢了，就想到多层嵌套数据渲染来提高效率。
直接上代码
wxml：
----{{item.name}}---- ----{{two.name}}---- ----{{three.name}}---- -------------------------------------------
js
one: [{
id: 1,
name:"第一层",
two: [{
"id": 11,
"name": "第二层第一个数据"
}, {
"id": 12,
"name": "第二层第二个数据"
}],
three: [{
"name": "第三层数据"
}]
},
{
id: 2,
name: "第二次渲染第一层",
two: [{
"id": 13,
"name": "第二层第一个数据2"
}, {
"id": 14,
"name": "第二层第二个数据2"
}],
three: [{
"name": "第三层数据"
}]
},
{
id: 3,
name: "第三次渲染第一层",
two: [{
"id": 15,
"name": "第二层第一个数据3"
}, {
"id": 16,
"name": "第二层第二个数据3"
}],
three: [{
"name": "第三层数据"
}]
}
]
实现效果图：
如果你想取其中一个数组的某个字段的值，可以用以下写法：
var twodata = this.data.one[0].two
var text = twodata[1].name
console.log(text)
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/98604.html
摘要：起因意图是想实现类似于安卓那样的效果，想到了用微信小程序的组件，但如果每个里都只用一个来渲染数据的话实在是太慢了，就想到多层嵌套数据渲染来提高效率。 起因：意图是想实现类似于安卓viewpager那样的效果，想到了用微信小程序的swiper组件，但如果每个swiper-item里都只用一个wx:for来渲染数据的话实在是太慢了，就想到多层嵌套数据渲染来提高效率。 直接上代码 wxml：...
摘要：起因意图是想实现类似于安卓那样的效果，想到了用微信小程序的组件，但如果每个里都只用一个来渲染数据的话实在是太慢了，就想到多层嵌套数据渲染来提高效率。 起因：意图是想实现类似于安卓viewpager那样的效果，想到了用微信小程序的swiper组件，但如果每个swiper-item里都只用一个wx:for来渲染数据的话实在是太慢了，就想到多层嵌套数据渲染来提高效率。 直接上代码 wxml：...
摘要：前言入门教程之列表渲染多层嵌套循环，目前官方的文档里，主要是一维数组列表渲染的案例，还是比较简单单一，给刚入门的童鞋还是无从入手的感觉。我们也会不定期发布一些微信小程序的学习教程。需要入群的小伙伴，请加我的个人微信。 前言 入门教程之列表渲染多层嵌套循环，目前官方的文档里，主要是一维数组列表渲染的案例，还是比较简单单一，给刚入门的童鞋还是无从入手的感觉。 {{index}}: {...
摘要：前言入门教程之列表渲染多层嵌套循环，目前官方的文档里，主要是一维数组列表渲染的案例，还是比较简单单一，给刚入门的童鞋还是无从入手的感觉。我们也会不定期发布一些微信小程序的学习教程。需要入群的小伙伴，请加我的个人微信。 前言 入门教程之列表渲染多层嵌套循环，目前官方的文档里，主要是一维数组列表渲染的案例，还是比较简单单一，给刚入门的童鞋还是无从入手的感觉。 {{index}}: {...
阅读 514·2023-04-26 00:33
阅读 3540·2021-11-24 09:39
阅读 2909·2021-09-22 15:34
阅读 2318·2019-08-23 18:07
阅读 2913·2019-08-23 18:04
阅读 3696·2019-08-23 16:06
阅读 2895·2019-08-23 15:27
阅读 1616·2019-08-23 14:32
