zoukankan      html  css  js  c++  java
  • 大三学习进度20

    Vue.js 循环语句

    循环使用 v-for 指令。

    v-for 指令需要以 site in sites 形式的特殊语法, sites 是源数据数组并且 site 是数组元素迭代的别名。

    v-for 可以绑定数据到数组来渲染一个列表:

    v-for 指令

    <div id="app">

      <ol>

        <li v-for="site in sites">

          {{ site.name }}

        </li>

      </ol>

    </div>

    <script>

    new Vue({

      el: '#app',

      data: {

        sites: [

          { name: 'Runoob' },

          { name: 'Google' },

          { name: 'Taobao' }

        ]

      }

    })

    </script>

    尝试一下 »

    模板中使用 v-for:

    v-for

    <ul>

      <template v-for="site in sites">

        <li>{{ site.name }}</li>

        <li>--------------</li>

      </template>

    </ul>

    尝试一下 »

    v-for 迭代对象

    v-for 可以通过一个对象的属性来迭代数据:

    v-for

    <div id="app">

      <ul>

        <li v-for="value in object">

        {{ value }}

        </li>

      </ul>

    </div>

    <script>

    new Vue({

      el: '#app',

      data: {

        object: {

          name: '菜鸟教程',

          url: 'http://www.runoob.com',

          slogan: '学的不仅是技术,更是梦想!'

        }

      }

    })

    </script>

    尝试一下 »

    你也可以提供第二个的参数为键名:

    v-for

    <div id="app">

      <ul>

        <li v-for="(value, key) in object">

        {{ key }} : {{ value }}

        </li>

      </ul>

    </div>

  • 相关阅读:
    【POJ1743】Musical Theme(后缀数组,二分)
    【BZOJ1031】字符加密Cipher(后缀数组)
    gui线程
    线程同步
    多线程
    java记事本
    gui界面2048小游戏
    IO流+数据库课后习题
    数据库(批处理, 事务,CachedRawSetImpl类
    java(try块语句变量,和匿名类变量生存时间
  • 原文地址:https://www.cnblogs.com/hhw12345/p/14159493.html
Copyright © 2011-2022 走看看