Vue中v-model与v-bind区别：
绑定数据的三种方式:
{{}}从data中取对应的值
v-model：
v-bind：
v-model
主要用于表单元素，实现了双向绑定。在同时使用v-model和v-bind中，v-model能建立双向绑定并且对input，select，textarea具有优先权。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>vue</title>
</head>
<script src="https://cdn.bootcss.com/vue/2.5.17-beta.0/vue.min.js"></script>
<body>
<div id="vm">
<input type="text" v-model="title"><br>
{{title}}
</div>
<script>
var vm=new Vue({
el:"#vm",
data:{
title:"hello vue"
}
});
</script>
</body>
</htm
v-bind
eg:v-bind:href可以简写为:href
当加上v-bind:之后href的值不是字符串，而实vue实例data.link的这个变量，也就是data.link是什么值，href就是得到什么值，当data.link变化而变化的href，这非常适合通过css来实现动画效果，是单向的变动。
<!DOCTYPE html>
<html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8">
<title>vue</title>
</head>
<script src="https://cdn.bootcss.com/vue/2.5.17-beta.0/vue.min.js"></script>
<body>
<div id="vm">
<a href="link">baidu</a>
<input v-model="link">baidu</input>
<a v-bind:href="link">baidu</a>
<a :href="link">baidu</a>
</div>
<script>
var vm=new Vue({
el:"#vm",
data:{
link:"http://www.baidu.com"
}
});
</script>
</body>
</html>