Vue最早版本迁移到2.0

来源:互联网 发布:qq飞车噬魂剃刀数据 编辑:程序博客网 时间:2024/05/22 15:04

刚开始接触Vue的第一个项目就是把Vue最低版本的项目迁移到现在最新的版本2.0,好玩又有挑战。

Vue中的知识点以及自2.0中的使用情况

indexkey:
在v-for循环中indexkey表示当前对象中的键值在2.0中均已废弃
2.0中的新语法

<li v-for="(item, index) in items"/></li><li v-for="(val, key, index) in items"/></li>

当组件不需要渲染模板中的内容,而是渲染默认的内容时,可以使用组件的inline-template属性,组件将把它的内容当做模板,而不是当做分发内容,而且inline-template的优先级高于template。
模板的顶级元素是单个元素,即组件元素必须有一个根节点,否则会报错。
2.0中绑定动态属性不再支持class=”{{msg}}”,只能使用:class=”item”.
$event原生事件对象,在2.0中已废弃。

<button @click="handleClick($event)"/></button>

v-ref:子组件的索引,可以通过父组件的$refs对象访问子组件。在2.0中已经废弃,改为ref属性

<div id="parent">  <user-profile ref="profile"></user-profile></div>var parent = new Vue({ el: '#parent' })// 访问子组件var child = parent.$refs.profile

这个属性同样可用于元素上

<p ref="p">hello</p>

用于取代v-el指令。

v-cloak:这个指令保持在元素上直到关联实例结束编译。和 CSS 规则如 [v-cloak] { display: none } 一起用时,这个指令可以隐藏未编译的 Mustache 标签直到实例准备完毕。

[v-cloak] {  display: none;}<div v-cloak>  {{ message }}</div>
0 0