我是怎么学会vue的07：v-bind属性绑定（简写用冒号）

我们之前学习了如何绑定标签的内容：使用模板{{ }}（Mustache语法），但这个语法只能用来绑定内容，不能用来绑定标签的属性。

实际开发中，标签的属性不是写死的，需要先从服务器请求，服务器返回json数据，把数据放进vue实例的data，再把data和标签的属性做绑定。

绑定方法：要给哪个属性绑定值，就在该属性前面加上v-bind:即可。

常用到的标签和属性如：a标签的href属性、img标签的src属性等。

1. html

   <img v-bind:src="imgUrl" alt=""/>

2. 数据

   data:{
      imgUrl:'abc.com/def.jpg'
   }

错误演示：
<img src="{{imgUrl}}">，这样写会把{{imgUrl}}解析成一个字符串，Mustache语法不支持绑定属性，只支持绑定内容，比如这样：<h2>{{message}}</h2>

缩写：使用冒号即可

<img v-bind:src="imgUrl" alt=""/> <!--不缩写-->
<img :src="imgUrl" alt=""/> <!--缩写-->