Vue指令之v-html

                           Vue指令之v-html

目录                     

1.v-html该怎么使用呢？？？

2.普通文本：

3.html结构：

4.总结：

---

v-html指令是设置innerHTML

1.v-html该怎么使用呢？？？

我们先在被vue实例挂载的标签div中，放入一个p标签，在p标签内部写入v-html指令，<p v-html="name"></p> ，那么name的值哪里来呢？

这就需要在data中去定义了，对于普通的文本和v-text没有什么差异，但是对于html结构就不一样了，它就会被解析出来，如下代码：

2.普通文本：

3.html结构：

4.总结：

• v-html 指令的作用：设置元素的innerHTML
• 内容中有html结构会被解析为标签
• v-text指令无论内容是什么，只会解析为文本
• 解析文本使用v-text,需要解析html结构使用v-html