<body>
<!--区别:v-text打印出来包含标签 v-html不包含标签-->
<div class="root" v-text="number"></div>
<div class="root1" v-html="number"></div>
<!--点击事件用v-on方法-->
<div id="root" v-on:click="tomyclick">{{number}}</div>
<!--点击事件用@方法-->
<div id="root1" @click="tomyclick">{{number}}</div>
<script>
new Vue({
el:".root",
data:{
number:"<h1>这是v-text方法</h1>"
},
})
new Vue({
el:".root1",
data:{
number:"<h1>这是v-html方法</h1>"
},
})
new Vue({
el:"#root",
data:{
number:"这是v-on:click方法"
},
methods:{
tomyclick : function(){
this.number = "点击之后的效果用v-on方法"
}
}
})
new Vue({
el:"#root1",
data:{
number:"这是v-on:click方法"
},
methods:{
tomyclick : function(){
this.number = "点击之后的效果用@方法"
}
}
})
</script>
</body>