网创优客建站品牌官网
为成都网站建设公司企业提供高品质网站建设
热线:028-86922220
成都专业网站建设公司

定制建站费用3500元

符合中小企业对网站设计、功能常规化式的企业展示型网站建设

成都品牌网站建设

品牌网站建设费用6000元

本套餐主要针对企业品牌型网站、中高端设计、前端互动体验...

成都商城网站建设

商城网站建设费用8000元

商城网站建设因基本功能的需求不同费用上面也有很大的差别...

成都微信网站建设

手机微信网站建站3000元

手机微信网站开发、微信官网、微信商城网站...

建站知识

当前位置:首页 > 建站知识

vue内置指令是怎么构成的

这篇文章主要介绍“vue内置指令是怎么构成的”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“vue内置指令是怎么构成的”文章能帮助大家解决问题。

创新互联是一家专注于成都网站制作、成都做网站、外贸营销网站建设与策划设计,东川网站建设哪家好?创新互联做网站,专注于网站建设十载,网设计领域的专业建站公司;建站业务涵盖:东川等地区。东川做网站价格咨询:028-86922220

内置指令有16个:v-text、v-html、v-show、v-if、v-else、v-else-if、v-for、v-on、v-bind、v-model、v-slot、v-pre、v-cloak、v-once、v-memo、v-is;其中v-memo是3.2新增的,v-is在3.1.0中废弃。v-show用于控制元素的显藏、v-if用于根据表达式的真假值来有条件地渲染元素。

1、什么是Vue指令

在Vue中,指令其实就是特殊的属性

Vue会根据指令,在背后做一些事,至于具体做什么事,Vue根据不同的指令会执行不同的操作,具体后面会说

指令有什么特点

Vue指令有个明显的特点就是,都是以v-开头,例如:v-text

2、内置指令

2.1 Vue有哪些内置指令呢

内置指令指的就是Vue自带指令,开箱即用

Vue一共有16个自带指令,包括了:

v-text、v-html、v-show、v-if、v-else、v-else-if、v-for、v-on、v-bind、v-model、v-slot、v-pre、v-cloak、v-once、v-memo、v-is,其中v-memo是3.2新增的,v-is在3.1.0中废弃

下面我们来了解一下这些内置指令的基本使用

2.2 了解16个内置指令的基本使用

2.2.1 v-text

v-text的作用是,用于更新元素的 textContent,例如:

h2元素的内容最终取决于msg的值

vue内置指令是怎么构成的

2.2.2 v-html

与v-text很像,只是v-html用于更新元素的 innerHTML,例如

Hello LBJ'">

vue内置指令是怎么构成的

需要注意的是,里头内容必须是按普通 HTML 插入

2.2.3 v-show

v-show可以根据表达式的真假值,切换元素的display值,用于控制元素的展示和隐藏,例如:

vue内置指令是怎么构成的

可以看到,当条件变化时该指令触发显示或隐藏的过渡效果

需要注意:v-show 不支持