当前位置: 首页 > news >正文

vue2:v-if和v-show的区别以及造成的影响

          <div class="form-box-4" v-show="checkedList.includes('0505')"><span class="form-box-4-label"><span style="color: red">*</span>三失一偏类型:</span><ta-form-itemfield-decorator-id="threelostoneType":span="24":field-decorator-options="{rules: [{ required: true, message: '请选择三失一偏类型' }],}":disabled="isTypeDisabled"><ta-checkbox-groupcollection-type="ZAFK_THREELOSTONE_TYPE":value="threelostoneTypeList":disabled="isTypeDisabled"/></ta-form-item></div>

看上面这一段代码,一个复选框,用div包裹,添加了一个v-if条件。就因为这个v-if,导致了接口返回的数据不能回显。
v-if和v-show都能控制元素是否显示,然而原理却完全不同。
v-if:如果为false就销毁元素,原来的那个dom对象就不存在了;如果为true,就创建一个新的dom对象。这导致了我在initForm中回显了数据,但是因为元素经历了一个销毁又被创建的过程,导致会显得数据消失了。
v-show:并不会创建或者销毁元素,而只是在页面上隐藏,无法看到,dom对象还是在的。但是也无法触发生命周期和钩子,因为对象一直都在。

http://www.hskmm.com/?act=detail&tid=36855

相关文章:

  • P6845 题解
  • LGP3694 邦邦的大合唱站队 学习笔记
  • 2025.10.22学习记录
  • 衡量效率,质量,运维的效率指标
  • LeeCode_101对称二叉树
  • TRAE 设计团队如何玩转 Vibe Coding(上)|高美感页面生成篇
  • LeeCode_226反转二叉树
  • 2025多校冲刺CSP模拟赛7 总结
  • 详细介绍:wpf之 Popup
  • 结对项目-生成四则运算
  • ? #4
  • CSS3 超实用属性:pointer-events (可穿透图层的鼠标事件)
  • 类和对象
  • 取证-windbg和dmp,以及文件分析基本流程
  • 【比赛记录】2025CSP+NOIP 冲刺模拟赛合集Ⅱ
  • 羊驼二次免疫的六大风险:纳米抗体制备不可忽视的 “隐形陷阱”
  • 完整教程:C++项目:仿muduo库高并发服务器-------connection模块
  • 深入解析:线性代数 SVD | 令人困扰的精度 1
  • 营销数字化专家要求
  • 小程序反编译包的架构文件
  • 10.22 CSP-S模拟37/2025多校冲刺CSP模拟赛7 改题记录
  • [题解]P11126 [ROIR 2024] 三等分的数组 (Day 2)
  • Acrobat Pro DC 2025下载及破解安装教程,附永久免费免激活中文版Acrobat Pro DC安装包(稳定版)
  • VSLAM 十四讲--阅读中知识点记录
  • 数据库学习篇(持续更新中)
  • Fortinet产品安全漏洞分析:FGFM协议未经认证连接重置漏洞
  • 李超线段树
  • fiddler修改请求(修改搜索框的内容)
  • 20251022
  • 10月22号