一、v-text
用于渲染普通文本，无论何时，绑定的数据对象上 msg属性发生了改变，插值处的内容都会更新。
| 1 2 3 | <span v-text= "message" ></span> <!-- 简写方式 --> <span>{{message}}</span> |
export default { data () { return { message: "这里可以包含html标签" } } }二、v-html
如果你想输出真正的 HTML，你需要使用 v-html指令，v-text仅渲染标签，不能解析 HTML 代码。
| 1 2 3 4 5 6 7 8 9 | <p v-text=“message”></p> <br> <p v-html= "message" ></p> <script type= "text/javascript" > var app = new Vue({ el: ‘#app‘ , //element data: { message: ‘<strong>Hello</strong> Vue!‘ , } }) </script> |
v-text展示效果： <strong>Hello</strong> Vue!
v-html展示效果： Hello Vue!
总结：v-text和{{}}表达式渲染数据，不解析标签。
v-html不仅可以渲染数据，而且可以解析标签。