看一个例子:
<html> <head> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> </head> <body> <div id="app"> <h2 v-text="message">这里有内容</h2> <h2 v-html="message">这里有内容</h2> <h2 v-html="content">这里有内容</h2> </div> <script> var app = new Vue({ el: '#app', data: { content: "<a href='#'>测试标签</a>", message: "测试内容", } }) </script> </body> </html>
结果:
说明:v-html用于设置元素的innerHTML,当内容是普通文本时与v-text没区别,当内容是html结构时,则会对html进行解析。