vue防止花括号{{}}闪烁v文本和v-html、v-斗篷用法示例
本文实例讲述了某视频剪辑软件防止花括号{{}}闪烁v文本和v-html、v-斗篷用法。分享给大家供大家参考,具体如下:
一、v文本和v-html
span { { msg } }/span-v-text { { { msg } } }-v-html
!DOCTYPE html html lang=' en ' head meta charset=' UTF-8 ' titlewww.jb51.net v-text和v-html/title style/style脚本src=' http :3359 cdn。bootscs。com/vue/1。0 .4/vue。量滴js ' async/script/head body div id=' box ' span { { { msg 2 } } }/span!- vue2.0已经去掉{{{}}防止闪烁方法- span v-text='msg1'/span!-文本的用v-text - span v-html='msg2'/span!-转义超文本标记语言标签- /div脚本新Vue({ el:'#box ',data:{ msg1: '欢迎文本,msg 2: ' strong欢迎html/strong ' } });/脚本/正文/html测试运行效果:
二、v形斗篷
风格[五形斗篷]{ /*比较大的段落,防止闪烁,看到花括号*/display:无;}/style div class=' reply ' v-for=' MSgdata ' v-斗篷p class='回复内容' { item。content } }/p p class=' operation ' span class='回复时间' { item。time | date } }/span class=' handle ' a href=' JavaScript :'rel=' external no follow ' rel=' external no follow ' rel=' external no follow ' class=' top ' { item。ACC } }/a href=' JavaScript :'rel=' external no follow ' rel=' external no follow ' rel=' external no follow ' class=' down _ icon '(项目。ref } }/a href=' JavaScript :'rel=' external nofollow ' rel=' external nofollow ' rel=' external nofollow ' class=' cut '删除/a /span /p/div感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://工具。JB 51。net/code/HTMljsrun测试上述代码运行效果。
希望本文所述对大家vue.js程序设计有所帮助。
版权声明:vue防止花括号{{}}闪烁v文本和v-html、v-斗篷用法示例是由宝哥软件园云端程序自动收集整理而来。如果本文侵犯了你的权益,请联系本站底部QQ或者邮箱删除。