微信小程序——列表渲染（wx:for）

╰半橙微兮° 2023-06-13 11:23 72阅读 0赞

项的变量名默认为item wx:for—item--可以指定数组当前元素的变量名

下标变量名默认为index wx:for—index--可以指定数组当前下标的变量名

wx:key ⽤来提⾼数组渲染的性能

wx:key 绑定的值 有如下选择

  1. string 类型，表⽰ 循环项中的唯⼀属性 如

20191117112419285.png

  1. 保留字 *this ，它的意思是 item 本⾝ ，*this 代表的必须是 唯⼀的字符串和数组

20191117112520775.png

20191117112609838.png

20191117112643726.png

ps:

如果在一个标签里面使用多次的wx:for标签的话要注意:

1.你要确定每个wx:key中的值是唯一的。

2.你要在第一个for循环的时候就得只用wx:for-item 设置该数组的变量的名字和 wx:for-index下标的名称

3.如果你是在wxml里面传值到js在渲染到另外一个页面或者是传值到另外一个数组的时候要注意的是

如果要显示值得话直接写你该数组的变量的名字和显示该数组的下标的话直接写的是wx:for-index下标的名称

例子：复选框选中多少个值就显示多少个值

需求：

1。将复选框选中的值存到数组list中

  1.   通过第一个for循环将数据显示到wxml中

2。将list数组赋值到新增数组list1中

3。再通过第二个for循环将数据显示到wxml中

代码：

wxml:

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llem9uZ3poZW4_size_16_color_FFFFFF_t_70

js：

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llem9uZ3poZW4_size_16_color_FFFFFF_t_70 1

发表评论

表情：
评论列表 （有 0 条评论，72人围观）

还没有评论，来说两句吧...

相关阅读

    相关 微信小程序WXML之列表渲染

    这一章节我们来学习一下我们在程序中另一个重要的语法结构循环结构，在java或C中是用for关键字的，在微信小程序中也是for关键字，但是不同的是语法结构有点不同，下面我们介绍一

    矫情吗；*矫情吗；*/ 0 赞/ 216 阅读