1.给router-link绑定事件
在vue-router中要使用<router-link>标签写入路由，在浏览器渲染的时候会把<router-link>标签渲染成
<a>标签，有时候需要为<router-link>注册事件，对于一般的html元素，直接使用@click="Fun"即可，
但是对于<router-link>，像普通html元素那样注册事件后并不管用，需要添加.native才会成功注册
实例代码：
<!-- 未添加.native的点击事件，点击事件无效 -->
<router-link to="/test1" @click='onClick'>点击</router-link>
<!-- 添加.native的点击事件，事件注册成功 -->
<router-link to="/test1" @click.native='onClick'>点击</router-link>2.给组件绑定原生事件
<!-- 事实上给组件绑定原生事件就需要.native修饰v-on，否则同样无法注册成功。 -->
<component-test @click='onClick'></component-test>
<component-test @click.native='onClick'></component-test>
3.v-for中的key
在做学生管理的时候，在vue文件里写v-for时发现报错。然后检查代码怎么都找不出问题，复制到HTML文件就不会报错了，然后就去查资料发现，在2.2.0+ 的版本里，当在组件中使用 v-for 时，key 是必须的，而我使用的是2.5.16版本，所以才会报错，那 key 又是什么呢？为什么一定要加 key 呢？首先 key是 vue 识别节点的一个通用机制，那有什么用呢？列表数据修改的时候,他会根据key值去判断某个值是否修改,如果修改,则重新渲染这一项,否则复用之前的元素;这样当你修改其中某一条数据时，只会重新渲染修改过的数据，能很好的提升性能
实例代码：
<body>
<div id="app">
<ul>
<li v-for='(item, index) in list' :key='index'>name: {{item.name}}</li>
</ul>
</div>
<script src="../lib/vue.js" type="text/javascript" charset="utf-8"></script>
<script>
var app = new Vue({
el: "#app",
data: {
list: [
{
id: 1,
name: 'test1',
}, {
id: 2,
name: 'test2',
}, {
id: 3,
name: 'test3',
},
]
},
});
</script>
</body>
那该使用什么做为 key 呢？key 是用于识别节点的，所以必须是唯一的，一般会使用index（即数组的下标），如果是修改一些已渲染的数据这个是可以的，只会重新渲染修改过的数据。
list: [
{
id: 1,
name: 'test1',
}, {
id: 2,
name: '我是修改过的数据',
}, {
id: 3,
name: 'test3',
},
]
//修改了其中一条数据，重新渲染这一条，其它的复用之前的插入一条数据到最后，这时候用index做为 key 是没问题的。
list: [
{
id: 1,
name: 'test1',
}, {
id: 2,
name: 'test2',
}, {
id: 3,
name: 'test3',
}, {
id: 4,
name: '我是添加到末尾的数据',
},
]
此时前三条数据直接复用之前的,新渲染最后一条数据，这个时候用index做为key是没问题的。
但是当在中间插一条数据。
list: [
{
id: 1,
name: 'test1',
}, {
id: 4,
name: '我是插队的一条数据',
}, {
id: 2,
name: 'test2',
}, {
id: 3,
name: 'test3',
},
]
再重新渲染你会发现除了第一条数据外，其它的数据都改变了
数据前后对比：
之前的数据 之后的数据
key: 0 index: 0 name: test1 key: 0 index: 0 name: test1
key: 1 index: 1 name: test2 key: 1 index: 1 name: 我是插队的那条数据
key: 2 index: 2 name: test3 key: 2 index: 2 name: test2
key: 3 index: 3 name: test3明明只是添加了一条数据，只需要渲染一条数据就可以了，为什么却重新渲染了三条数据。很明显这样就达不到就地复用的效果，那最好的办法就是定一个不会改变的 key，你观察一下就会发现每条数据除了 index 外还有 id 也是唯一的，并且 id 不会像 index 一样发生改变，我们来看一下数据对比
之前的数据 之后的数据
key: 1 id: 1 index: 0 name: test1 key: 1 id: 1 index: 0 name: test1
key: 2 id: 2 index: 1 name: test2 key: 4 id: 4 index: 1 name: 我是插队的那条数据
key: 3 id: 3 index: 2 name: test3 key: 2 id: 2 index: 2 name: test2
key: 3 id: 3 index: 3 name: test3
发现了么，只有 id 为4的数据发生了改变，因此只要新渲染这一条数据就可以了,其他都是就复用之前的，这样当数据量大的时候就能很好的提升效率。