Vue.js 2.0版

Posted 2020-08-16

Vue.js 2.0版升级，更改了好多方法或指令

new Vue({
     el:‘#demo‘,
     data:{
         msg:"vue2.0"
      }
})

v-model

lazy 　number　debounce (2.0版废弃) 　新加　lazy


• .lazy - 取代 input 监听 change 事件
• .number - 输入字符串转为数字
• .trim - 输入首尾空格过滤

<input v-model.lazy="msg" />

v-for

v-for迭代语法变化

• 丢弃$index和$key

• 新数组语法

  • value in arr

  • (value, index) in arr

• 新对象语法

  • value in obj

  • (value, key) in obj

  • (value, key, index) in obj

value 值　key 键　index 索引下标
<li v-for="item in items">{{item.id}}</li>
<li v-for="(value,key) in items">{{value.id}}--{{key}}</li>
<li v-for="(value,key,index) in items">{{value.id}}--{{key}}--{{index}}</li>