用双大括号括起变量,是从Vue中的data获取数据的标识
<div id="app">
<input type="text" v-on:input="changeName"> <!--使用指令v- -->
<h1>{{name}}</h1>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
new Vue({
el:"#app",
data:{
name:"ccy"
}, // 变量均存储在data中
methods:{
changeName: function(e){
this.name = e.target.value;
}
} // 方法均存储在methods中
})
</script>
效果:
h1的初始内容是:ccy,
当文本框输入内容时,h1的内容随着文本框内容的改变而改变