v-html和v-text的区别

html-css011

v-html和v-text的区别,第1张

v-html:不仅用于渲染数据,还能够输出真正的html,即能够解析html代码

v-text:用于渲染普通文本,绑定的数据对象发生变化时,插值处的内容也会发生改变,注意它不解析标签

第一步,创建静态页面vhtml.html,并引入vue.js文件

第二步,在元素内插入两个div,一个作为外层div,另外一个作为子div,并在父div绑定v-html指令

第三步,绑定v-html指令数据,这里设置为字符串

第四步,Vue.js库的v-html指令是插入html元素,修改datas为包含

标签

第五步,预览该静态页面,这时会看到页面显示为“v-html指令”

第六步,将调试打开,这时发现

中有个

标签,就成功地添加了html元素。