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

相关推荐
weixin_545019323 小时前
微信小程序智能商城系统(uniapp+Springboot后端+vue管理端)
spring boot·微信小程序·uni-app
wx+qutudy4 小时前
CPS联盟+小程序聚合平台分销返利系统开发|小红书&番茄网盘CPA拉新推广全解析
小程序·cps联盟·小程序聚合平台
小咕聊编程6 小时前
【含文档+PPT+源码】基于微信小程序的社区便民防诈宣传系统设计与实现
微信小程序·小程序
❀͜͡傀儡师6 小时前
使用mermaid 语言绘画时序图和链路图
notepad++
向明天乄7 小时前
uni-app微信小程序登录流程详解
微信小程序·uni-app
小新1108 小时前
微信小程序学习之轮播图swiper
学习·微信小程序·notepad++
前端 贾公子8 小时前
UniApp 微信小程序绑定动态样式 :style 避坑指南
notepad++
熊猫钓鱼>_>11 小时前
中国版Cursor,基于腾讯云CodeBuddy的节日推荐小程序的智能化开发实践
小程序·腾讯云·节日
AC-PEACE12 小时前
小程序初始化加载时间优化 步骤思考与总结
react.js·小程序·前端框架
老李不敲代码12 小时前
榕壹云打车系统:基于Spring Boot+MySQL+UniApp的开源网约车解决方案
spring boot·mysql·微信小程序·uni-app·软件需求