专栏首页达达前端(6)打鸡儿教你Vue.js

(6)打鸡儿教你Vue.js

循环语句

循环使用 v-for 指令

<div id="app">
 <ol> // 有序
  <li v-for="item in items">
   {{ items.name }}
  </li>
 </ol>
</div>

<script>
new Vue({
 el: '#app',
 data: {
  items: [
  {},
 ]
}
})
</script>
<ul>
 <template v-for="item in items">
  <li>{{item.name}}</li>
 </template>
</ul>
<div id="app">
  <ul>
    <li v-for="value in object">
    {{ value }}
    </li>
  </ul>
</div>
<script>
new Vue({
  el: '#app',
  data: {
    object: {
      name: ''
    }
  }
})
</script>
<div id="app">
  <ul>
    <li v-for="(value, key) in object">
    {{ key }} : {{ value }}
    </li>
  </ul>
</div>
<div id="app">
  <ul>
    <li v-for="(value, key, index) in object">
     {{ index }}. {{ key }} : {{ value }}
    </li>
  </ul>
</div>
<div id="app">
  <ul>
    <li v-for="n in 10">
     {{ n }}
    </li>
  </ul>
</div>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • (10)打鸡儿教你Vue.js

    event.preventDefault() 或 event.stopPropagation()

    达达前端
  • Web前端JQuery入门实战案例

    快速的,轻量级的,功能丰富的 js 库。动画(animation),ajax,DOM,更简单,容易使用的api。

    达达前端
  • 【叔小生】JavaScript进阶篇

    如何插入JS JS基础语法 语法、函数、方法 提取字符串substring() substring() 方法用于提取字符串中介于两个指定下标之间的字符。

    达达前端
  • 基于jQuery的公告无限循环滚动实现代码

    基于jQuery的公告无限循环滚动实现代码,效果如下,多用于pc端电商网站之中不断的循环更新的公告消息。

    王小婷
  • Linode 虚拟主机安装 discourse 邮件没有发送

    linode VPS 安装后 discourse 的电子邮件始终没有办法发送成功。

    HoneyMoose
  • flex-direction

    用户7873631
  • 【率土之滨】零元党S1发育指南(更新中)

    主五要三: 圈地概念,主城五格范围内(不算主城城区格),要塞三格范围内的领土一般其他玩家不应该来攻打,死人(长时间不上线的玩家)除外。

    代码咖啡
  • thinkPHP+mysql+ajax实现的仿百度一下即时搜索效果详解

    本文实例讲述了thinkPHP+mysql+ajax实现的仿百度一下即时搜索效果。分享给大家供大家参考,具体如下:

    砸漏
  • 释放低代码小宇宙,微软 Power Platform 震撼来袭!

    “人工智能和机器学习正在深入地渗透到每种体验中,我们的真正任务不是庆祝这些重大研究突破,而是使人工智能大众化,以便每个开发人员都可以构建这些应用程序。这意味着要...

    寒树Office与RPA
  • 数据预处理:PCA原理推导

    《实例》阐述算法,通俗易懂,助您对算法的理解达到一个新高度。包含但不限于:经典算法,机器学习,深度学习,LeetCode 题解,Kaggle 实战。期待您的到来...

    double

扫码关注云+社区

领取腾讯云代金券