vue从入门到精通(十一):条件渲染

条件渲染

1.v-if

写法:

(1).v-if="表达式"

(2).v-else-if="表达式"

(3).v-else="表达式"

适用于:切换频率较低的场景。

特点:不展示的DOM元素直接被移除。

注意:v-if可以和:v-else-if、v-else一起使用,但要求结构不能被"打断"

2.v-show

写法:v-show="表达式"

适用于:切换频率较高的场景。

特点:不展示的DOM元素未被移除,仅仅是使用样式隐藏掉

3.备注

使用v-if的时候,元素可能无法获取到,而使用v-show一定可以获取到。

相关推荐
promiseThen几秒前
LWC Workflow:用 7 个 Cursor Skill 搭一条 AI 协作开发流水线
前端·ai编程
一个游离的指针23 分钟前
函数管道:消除深度嵌套调用
前端·javascript
浅诺32 分钟前
Nginx sub_filter 的“幽灵陷阱”:为什么页面能打开,懒加载的 JS 却全是 404?
前端
PBitW44 分钟前
为什么vite中TS报错,可以继续运行?Webpack不行?
前端·webpack·typescript·vite
光影少年1 小时前
react navite手写 FlatList 优化配置
前端·react native·react.js
曹牧1 小时前
C#:文本文件读取
服务器·前端·c#
柚yuzumi1 小时前
前端优化,从少触发一次开始:防抖与节流
前端·javascript
默_笙1 小时前
🚤 CSS 布局的"圈地运动":BFC 就是浏览器的独立领地
前端·javascript
我爱写代码i1 小时前
AI对话绘画数字人源码 - uniapp前端
前端·人工智能·uni-app
OpenTiny社区2 小时前
太酷了!装上OpenTiny dsh‑genui这个插件,你的DeepSeek Harness点击就能干活了!
前端·ai编程