vue指令v-html和v-text
阿新 • • 發佈:2021-11-22
目錄
- 1、v-text 文字渲染指令
- 2、 v-html
1、v-text 文字渲染指令
(只能渲染文本不能渲染標籤)
<div id="test"> <p v-text="message"></p> &www.cppcns.comlt;/div> <script src=".//.js"></script> <script> const vm = new Vue({ el:"#test",data:{ message:"&http://www.cppcns.comlt;h2>hello vue</h2>" } }) </script>
輸出結果為:
2、 v-html
(可以渲染指令,可以渲染標籤)
<div id="test">
<p v-html="message">&l客棧t;/p>
</div>
<script src="./js/vue.js"www.cppcns.com></script>
<script>
const vm = new Vue({
el:"#test",data:{
message:"<h2>hello vue</h2>"
}
})
</script>
輸出結果為:
到此這篇關於 vue指令v-html和v-text的文章就介紹到這了,更多相關v-html和v-text內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!