小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。
📝【Vue】学习养成记,【程序员必备小知识】
📔 今日小知识——Vue常用指令之v-html
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
Vue 官方文档:vuejs.org/v2/guide/sy…
Vue 中文文档: cn.vuejs.org/v2/guide/sy…
5. 写在后面
关注我,更多内容持续输出
🌹 喜欢就点个赞吧👍🌹
🌹 觉得有收获的,可以来一波 收藏+关注,以免你下次找不到我😁🌹
🌹欢迎大家留言交流,批评指正,
转发请注明出处,谢谢支持!🌹