数据绑定最常见的方式就是使用{{...}}进行文本插值：
<body> <div id = "app"> {{name}}{{age}} </div> <script> var app = new Vue({ el:'#app', data:{ name:'lisi', age:18 } }) </script> </body>使用v-html指令进行输出html代码：
<div id="app"> <div v-html="message"></div> </div> <script> new Vue({ el: '#app', data: { message: '<h1>h1标题</h1>' } }) </script>v-html会将文本中的具有html结构的解析成标签
为元素绑定属性使用v-bind（简写省略v-bind 只保留：属性名）
以下实例判断use的值，如果为true，使用class1的样式，否则不使用
<div id="app"> <label for="r1">修改颜色</label><input type="checkbox" v-model="use" id="r1"> <br><br> <div v-bind:class="{'class1': use}"> v-bind:class 指令 </div> </div> <script> new Vue({ el: '#app', data:{ use: false } }); </scrip>
v-on用于绑定事件
<div class="app"> <button v-on:click="myclick">click me</button> </div> var app = new Vue({ el:'.app', data:{ }, methods:{ myclick:function(){ console.log(111111); } } });
vue.js提供了完全的JavaScript表达式支持。例如
<div> {{number + 1}} <br> {{ ok ? 'YES' : 'NO' }} </div>
