Vue最早版本迁移到2.0

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

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

$index，$key:
在v-for循环中$index表示当前数组的索引，$key表示当前对象中的键值在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>