微信小程序--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.练习

相关推荐
Ai-_Man4 小时前
Meta Muse还是不可以导出左侧所有对话,只能点进去单条内容导出,方法不对吗?
开发语言·人工智能·ai·小程序·c#·1024程序员节
冬奇Lab5 小时前
一天一个开源项目(第247篇):wxa-runner —— 让小程序在普通浏览器里用微信官方基础库跑起来,直接接 Playwright 做无头 E2E
微信小程序·开源
andrsted7 小时前
练题簿在线免费刷题:让整理过的资料,变成能反复练习的题库
学习·微信小程序·小程序·学习方法·刷题·1024程序员节
CRMEB系统商城16 小时前
家电零售的供应商协同与物流提效
java·开发语言·人工智能·小程序·1024程序员节
CRMEB系统商城16 小时前
Redis + 消息队列 + 连接池:CRMEB PRO 性能优化的三驾马车
大数据·数据库·人工智能·小程序·php·1024程序员节
CRMEB系统商城19 小时前
服装连锁的导购分销与企微私域
java·大数据·开发语言·人工智能·小程序·php·1024程序员节
梅雅达编程笔记19 小时前
Day 17 | uni-app 小程序:前端从零搭建
微信小程序·typescript·uni-app·vue3·pinia·前端开发·全栈
zhiboshequ2 天前
Ai音视频对话在微信小程序端的技术实现方案
人工智能·微信小程序·live-pusher·live-player·音视频对话
小蒜学长2 天前
基于过程性评价的ai助学平台(代码+数据库+LW)
java·spring boot·后端·微信小程序·过程性评价
00后程序员张2 天前
无需 Mac 的 iOS App 上架工具,开心上架Appuploader 负责哪些环节
android·ios·小程序·https·uni-app·iphone·webview