Vue-指令之{{ }}、v-text、v-html(基础指令)

---什么是Vue的指令?---

指令 (Directives) 是带有 v- 前缀的html标签的特殊属性。指令属性值应该是一个单独的javascript表达式(V-for除外)。指令的工作是在其表达式的值发生变化时,将其产生的连带影响,响应式地作用于 DOM。

其实通俗一点来讲:Vue 中,通过一些特殊的语法,扩展了 HTML标签 的能力。

(一)插值表达式 {{  }}

语法:

<标签>{{ 表现的数据信息 }}</标签>

数据信息:javascript表达式

表达式:常量、变量、各种运算符(算数、比较、逻辑、三元)

注意:变量值不改变的前提下,可以使用各种运算符表达式。

Dome:

效果:

(二) v-text

注意:

1-v-text所在的标签如果有默认内容,其会覆盖

2-{{ }}左右也可以提供默认内容,与插值表达式没有关系

3-v-text如果和{{}} 同时存在,v-text覆盖{{ }}

4-如果在网速慢的情况下,相比{{ }}来讲,会出现 闪烁的效果,而v-text是不会有闪烁的,最多不给自己显示。

Dome:

效果:

(三)拓展

<      &lt;

>      &gt; 

这个也很重要哦。

(四)v-html

Dome:

效果:

---下一章继续讲Vue其他指令---

 

猜你喜欢

转载自blog.csdn.net/weixin_43595461/article/details/89356822