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

VUE学习之路——列表渲染

<p v-for="item in items">{{ item }}</p>

使用v-for进行列表的渲染。
这仅仅是一个简单的demo,使用v-for可以用来遍历数组和对象,具体如下:
注意:遍历数组或对象的时候,()的顺序不要更换。遍历的时候使用of代替in具有同样的效果。
遍历数组:

<p v-for="(item,index) in items">{{ item }} - {{ index }}</p>
<p v-for="(value,key,index) in items">{{ value }} - {{ key }} - {{ index }}</p>

通过key管理状态
在这里插入图片描述
元素顺序发生改变的时候,不加key,重新渲染;加key,只改变顺序。


http://www.kler.cn/news/232794.html

相关文章:

  • 【django】建立python虚拟环境-20240205
  • 【学网攻】 第(24)节 -- 帧中继(点对点)
  • PlantUML绘制UML图教程
  • Java 学习和实践笔记(2)
  • 【STL】list模拟实现
  • 【Linux】文件的软硬链接
  • [WUSTCTF2020]朴实无华(特详解)
  • Blend for Visual Studio 工具作用
  • RESTful API是什么?,以及如何使用它构建 web 应用程序。
  • 数据库管理-第145期 最强Oracle监控EMCC深入使用-02(20240205)
  • uniapp踩坑之项目:简易版不同角色显示不一样的tabbar和页面
  • Vue-Vue3 集成编辑器功能
  • 有道ai写作,突破免费限制,无限制使用
  • 数据库管理-第147期 最强Oracle监控EMCC深入使用-04(20240207)
  • 怎么把视频音乐提取成mp3?分享详细工具和方法!
  • 支持向量机
  • LeetCode力扣 面试经典150题 详细题解 (1~5) 持续更新中
  • Redis核心技术与实战【学习笔记】 - 26.Redis数分布优化(应对数据倾斜问题)
  • transformer剪枝论文汇总
  • 【Golang】定时任务Cron指南-毫秒级任务支持
  • MFC实现遍历系统进程
  • 新版MQL语言程序设计:组合模式的原理、应用及代码实现
  • 树与二叉树---数据结构
  • 医学三基答案在哪搜?4个大学生必备的搜题 #知识分享#职场发展
  • 【服务器数据恢复】服务器RAID模块硬件损坏的数据恢复案例
  • Redis——集群环境部署
  • 飞桨AI for Science流体超分FNO模型案例分享
  • django安装使用
  • 2. Maven 继承与聚合
  • 微信小程序(三十四)搜索框-带历史记录