好资源导航 » 文章资讯 » vue中v-text / v-html使用实例代码详解

vue中v-text / v-html使用实例代码详解

2023-08-25 03:26:04 228

废话少说，代码如下所述：





Vue实例中的数据,事件和方法

newVue({ el:"#root", data:{ msg:"world", number:123 } })

显示123





Vue实例中的数据,事件和方法

newVue({ el:"#root", data:{ content:"

helloworld

", } })

补充：vuejs{{}}，v-text和v-html的区别


{{message}}

区别：

{{message}}：将数据解析为纯文本，不能输出真正的html，在页面加载时显示{{}}，所以通常使用v-html和v-text代替，且花括号方式在以后可能被取消

v-html="html"：输出真正的html

v-text="text"：将数据解析为纯文本，不能输出真正的html，与花括号的区别是在页面加载时不显示{{}}

总结

以上所述是小编给大家介绍的vue中v-text/v-html使用实例代码详解，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的！