您的位置:首页 > Web前端 > Vue.js

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

2019-04-18 09:43 435 查看

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

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

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

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

语法:

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

数据信息:javascript表达式

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

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

Dome:

效果:

(二) v-text

注意:

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

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

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

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

Dome:

效果:

(三)拓展

<      &lt;

>      &gt; 

这个也很重要哦。

(四)v-html

Dome:

效果:

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

 

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: