一 模板指令简写:
v-on: ——> @ 例如:v-on:click ——> @click
v-bind: ——> : 例如:v-bind:title ——> :title
二 模板指令等号后的内容是js表达式
<div id="root">
<div v-bind:title="'Dell lee ' + title"></div>
</div>
<script>
new Vue({
el: "#root",
data: {
title: "this is a title"
}
})
</script>
输出title为:Dell lee this is a title
三 双向数据绑定
<div id="root">
<input v-model="content" />
<div>{{content}}</div>
</div>
<script>
new Vue({
el: "#root",
data: {
content: "Hello World"
}
})
</script>
如图:当改变input框的值时,实例中的content值会跟着改变