text)的使用
某些情况下我们不但愿界面的内容随意地跟从转变,这时我们可以使用v-once来到达此目的。
(1)该指令后面不需要跟任何的表达式;
(2)该指令暗示元素和组件只衬着一次不会跟着数据的转变而产生变革。
e.g.
打开浏览器的控制台,在控制台中输入:app.message = ‘hahaha‘;
第一个产生变革,第二个无变革。
2.v-html:
在某些情况下我们从处事器请求到的数据就是一个HTML代码,如果我们直接使用{{}}来输出,会将HTML代码直接输出。但是我们但愿的是凭据HTML的格局进行解析,并将内容显示出来。
可以使用v-html指令,该指令后面往往带上一个string类型,它会将string类型的HTML解析出来并且进行衬着。
e.g.
功效:
3.v-text:
v-text的感化与Mustache( {{}} )对照类似,都是用于将数据显示在页面中,在凡是情况下v-text接收一个string类型。但是如果同时存在v-text和Mustache,v-text的内容会笼罩Mustache的内容。
e.g.
功效:
4.v-pre:
这个指令用于跳过这个元素和它子元素的编译过程,用于显示原本的Mustache语法。
e.g.
第一个h2元素中的内容会被编译解析出来对应的内容,第二个h2元素会直接显示{{message}}。
功效:
5.v-cloak:
在某些情况下浏览器可能会直接显示出来未编译的Mustache标签,v-cloak可用于防闪烁。
e.g.
由于延迟函数的存在,在一秒达到之前,vue实例还未初始化,因此此时网页上显示的是{{message}},当达到一秒之后,{{mesage}}会顿时酿成‘你好啊‘,此变革的瞬间孕育产生了闪烁。
为防备闪烁,在变量未编译的时候,不予显示,而当编译好了之后,,才显示出来。
在vue解析之前,div中有一个属性v-cloak,共同css的display可以使元素不显示;
在vue解析之后,div没有一个属性v-cloak。
6.v-for:
遍历数组。
e.g.
功效:
Vue-根基指令(v-once, v-pre, v-html, v-cloak, v-for, v-text)的使用
温馨提示: 本文由Jm博客推荐,转载请保留链接: https://www.jmwww.net/file/web/32887.html