微信小程序--24(列表渲染)

一、wx:for

1.作用

  • 根据指定数组,循环渲染重复的组件结构

2.语法

  • <view wx:for="{{data中的数据}}">
    索引是:{{index}}, item项是:{{item}}
    </view>

  • index:表索引

  • item:表当前循环项

3.练习

二、手动指引索引和当前项的变量名(换名)

1.语句

  • wx:for-index
    指定当前循环项的索引变量名

  • wx:for-item
    指定当前项的变量名

2.练习

三、wx:key

1.作用

  • 通个Key指定渲染,提高渲染效率

2.语句

  • <view wx:for="{{userList}}" wx:key="id">{{item.name}}</view>

3.练习

相关推荐
666HZ6664 小时前
微信小程序中scss、ts、wxml
微信小程序·小程序·scss
二十十十十十5 小时前
微信点餐小程序—美食物
微信·小程序
向明天乄5 小时前
在小程序中实现实时聊天:WebSocket最佳实践
websocket·网络协议·小程序
h185385922445 小时前
租车小程序电动车租赁小程序php方案
小程序
海的诗篇_5 小时前
前端开发面试题总结-原生小程序部分
前端·javascript·面试·小程序·vue·html
说私域5 小时前
基于开源AI智能客服、AI智能名片与S2B2C商城小程序的微商服务质量提升路径研究
人工智能·小程序·开源
牧杉-惊蛰5 小时前
uniapp微信小程序css中background-image失效问题
css·微信小程序·uni-app
拼图20911 小时前
微信小程序——skyline版本问题
微信小程序·小程序
mg66812 小时前
微信小程序入门实例_____打造你的专属单词速记小程序
微信小程序·小程序
【ql君】qlexcel12 小时前
Notepad++ 复制宏、编辑宏的方法
开发语言·javascript·notepad++··宏编辑·宏复制