Vue指令中的v-html和v-text
阿新 • • 發佈:2018-11-13
vue預設會把資料當成一個字串進行分析,而不會對其中的dom節點進行分析。採用v-html可以讓vue對dom的節點進行分析,如果要求不對dom節點進行分析的,可以採用v-text,或者什麼也不寫
程式碼如下:
<div id="app"> <p>{{html1}}</p> <p v-text="html2"></p> <p v-html="html3"></p> </div> <script> var vm=new Vue({ el:'#app', data:{ html1:"<a href='https://www.baidu.com/'>什麼也不加的百度</a>", html2:"<a href='https://www.baidu.com/'>v-text的百度</a>", html3:"<a href='https://www.baidu.com/'>v-html的百度</a>" } }) </script>
程式碼執行效果如下: