一、参数：一些指令能够接收一个“参数”，在指令名称之后以冒号表示
<a v-bind:href="url">单击我试试</a>
在这里 href 是参数，告知 v-bind 指令将该元素的 href attribute 与表达式 url 的值绑定。
<a v-on:click="doSomething">再单击试试</a>
二、动态参数：可以用方括号括起来的 JavaScript 表达式作为一个指令的参数
<!-- 注意，参数表达式的写法存在一些约束，如之后的“对动态参数表达式的约束”章节所述。 --> <a v-bind:[attributeName]="url"> ... </a>
这里的 attributeName 会被作为一个 JavaScript 表达式进行动态求值，求得的值将会作为最终的参数来使用。例如，如果你的 Vue 实例有一个 data property attributeName，其值为 "href"，那么这个绑定将等价于 v-bind:href。
同样地，你可以使用动态参数为一个动态的事件名绑定处理函数：
<a v-on:[eventName]="doSomething"> ... </a>
在这个示例中，当 eventName 的值为 "focus" 时，v-on:[eventName] 将等价于 v-on:focus。
三、修饰符： (modifier) 是以半角句号 . 指明的特殊后缀，用于指出一个指令应该以特殊方式绑定
例如，.prevent 修饰符告诉 v-on 指令对于触发的事件调用 event.preventDefault()：
<form v-on:submit.prevent="onSubmit">...</form>
四、本文全部代码
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>VUE简单示范</title> <script type="text/javascript" src="../js/vue.js" charset="utf-8"></script> </head> <body> <div id='app-12'> <a v-bind:href="url">单击我试试</a> <a v-on:click="doSomething">再单击试试</a> </div> <script> var myData = { url: 'http://www.baidu.com', msg: 'Hello there' } var vm1 = new Vue({ el: '#app-12', data: myData, methods: { doSomething:function(){ console.log('再单击试试，照做了'); } } }) </script> </body> </html>
本文参考：
https://cn.vuejs.org/v2/guide/syntax.html#%E6%8C%87%E4%BB%A4