Vue 指令01——v-test和v-html的使用
V-test指令
作用:替换标签里的文本内容
v-test的实例
<!--程序1-->
<!--把h2标签的”1234“,替换成”笑哈哈“-->
<div>
<h2 v-text="message">1234</h2>
</div>
<!--程序2-->
<!--把h2标签的”12“,替换成”笑哈哈“ ,并加上”哭兮兮“-->
<div>
<h2>12{{message+'哭兮兮'}}</h2>
</div>
var app=new Vue({
el:"#app",
data:{
message:"笑哈哈"
}
})
v-html指令
作用:在标签内容替换成标签
v-html的实例
<!--把h2标签的”1234“,替换成”a标签链接到百度“-->
<div>
<h2 v-html="message">1234</h2>
</div>
var app=new Vue({
el:"#app",
data:{
message:"<a scr='https://www.baidu.com'>百度</a>"
}
})