一招搞定Vue常用指令

 /* 在html中使用v-for指令进行渲染 */
/*
 普通数组
 */
  data:{
      list:[1,2,3,4,5,6]
   }
  <p v-for="(item,i) in list">--索引值--{{i}}   --每一项--{{item}}</p>

/*
 对象数组
 */
 data:{
      list:[1,2,3,4,5,6],
      listObj:[
        {id:1, name:'zs1'},
        {id:2, name:'zs2'},
        {id:3, name:'zs3'},
        {id:4, name:'zs4'},
        {id:5, name:'zs5'},
        {id:6, name:'zs6'},
      ]
}
   <p v-for="(user,i) in listObj">--id--{{user.id}}   --姓名--{{user.name}}</p>

/*
  对象
  */
  data:{
      user:{
        id:1,
        name:'托尼.贾',
        gender:'男'
      }
 }
 <p v-for="(val,key) in user">--键是--{{key}}--值是--{{val}}</p>

/*
 数字
 <!-- 注意：如果使用v-for迭代数字的话，前面 count 的值从 1 开始-->
 */
<p v-for="count in 10">这是第{{count}}次循环</p>

<p v-bind:属性名="变量"></p>
//可以简写成
<p :属性名="变量"></p>

//如果要赋值常量，需要给常量用单引号包起来，如
<p :属性名=" '常量' "></p>

<p v-on:click=" num = 1 "></p>
//可以简写成
<p @click=" num = 1 "></p>