当前位置: 首页 > news >正文

微信小程序(二十七)列表渲染改变量名

注释很详细,直接上代码

上一篇

新增内容:
1.改变默认循环单元item变量名
2.改变默认循环下标index变量名

基础模板有问题可以先看上一篇

源码:

index.wxml

<view class="students"><view class="item"><text>下标</text><text>序号</text><text>姓名</text><text>年龄</text><text>性别</text></view><!-- 书接上篇,如果出现嵌套的怎么办,总不能都叫item吧这里阐述一下如何修改单元项的名字wx:for-item="新名字"举一反三,如何修改下标序号对象的名字wx:for-index="新名字"--><view wx:for="{{students}}" wx:key="id" wx:for-item="stu" wx:for-index="idx" class="item"><text>{{idx}}</text><text>{{stu.id}}</text><text>{{stu.name}}</text><text>{{stu.age}}</text><text>{{stu.gender}}</text></view>
</view>

index.wxss

.item{display: flex;/* 水平均分 */justify-content:space-evenly;
}

index.js

Page({data:{students:[{id:1,name:"阿猫",age:20,gender:"男"},{id:2,name:"阿狗",age:19,gender:"女"},{id:3,name:"阿猪",age:18,gender:"男"}]}
})

效果演示:

在这里插入图片描述

http://www.lryc.cn/news/293267.html

相关文章:

  • k8s之安装部署及kuboard发布应用
  • JProfiler for Mac:提升性能和诊断问题的终极工具
  • 力扣202-快乐数
  • 牛客寒假训练营H题
  • ubuntu22.04@laptop 常用基础环境安装
  • Linux第41步_移植ST公司uboot的第2步_修改网络驱动_USB OTG设备树_LCD驱动_以及编译和烧写测试
  • 瑞芯微1808模型转换(onnx到rknn)环境配置过程
  • 测试ASP.NET Core项目调用EasyCaching的基本用法(InMemory)
  • 机器学习系列-2 线性回归训练损失
  • spring-boot-actuator 服务监控
  • 窥探向量乘矩阵的存内计算原理—基于向量乘矩阵的存内计算
  • Python flask 表单详解
  • 【Tomcat与网络3】Tomcat的整体架构
  • k8s中cert-manager管理https证书
  • 如何搭建私有云盘SeaFile并实现远程访问本地文件资料
  • Centos7安装Nginx-1.21
  • React 面试题
  • Postgresql使用update
  • Django视图函数技巧,从入门到实战
  • 部署实战--修改jar中的文件并重新打包成jar文件
  • RT-Thread线程管理(使用篇)
  • 【HarmonyOS】鸿蒙开发之ArkTs初步认识——第2.1章
  • 随手记:uni-app中使用iconfont彩色图标
  • 02-OpenFeign-微服务接入
  • 【前端工程化】环境搭建 nodejs npm
  • 在VM虚拟机搭建NFS服务器
  • springboot并mybatis入门启动
  • 什么是单例模式与饿汉式单例模式的区别是什么?
  • 【数据结构】认识数据结构 (通俗解释)
  • C语言——深入理解指针(1)