但是，除了内容需要动态来决定外，某些属性我们也希望动态来绑定。比如动态绑定 a元素的href属性，比如动态绑定 img元素的 src属性。
这个时候，我们可以使用v-bind指令∶
- 作用：动态绑定属性
- 缩写：:
- 预期：any (with argument) | Object (without argument)
- 参数：attrOrProp (optional)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Title</title> </head> <body> <div id="app"> <!--错误的做法:这里不可以使用mustache语法--> <!--<img src="{{imgURL}}" alt="">--> <!--正确的做法:使用v-bind指令--> <img v-bind:src="imgURL" alt="" /> <a v-bind:href="aHref">百度一下</a> <!--<h2>{{}}</h2>--> <!--语法糖的写法--> <img :src="imgURL" alt=""> <a :href="aHref">百度一下</a> </div> <script src="../js/vue.js "></script> <script> setTimeout(function() { const app = new Vue({ el: '#app', data: { message: '你好啊', imgURL: 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1599998657341&di=95b1c83d837a8adb05f48208df3ce146&imgtype=0&src=http%3A%2F%2Fpic1.win4000.com%2Fwallpaper%2Fa%2F51c41ae1ec1b5.jpg', aHref: 'http://www.baidu.com' } }) }, 1000) </script> </body> </html>