vue表单弹窗最大化无法渲染复杂组件内容

背景:最大化后选然后复杂组件内容丢失,如下拉框、图片上传组件
在这里插入图片描述

  • 修复方案:使用深拷贝

  • 核心代码

this.maximizeDialog = {visible: true,title: '患者申请 - 最大化查看',formModel: JSON.parse(JSON.stringify(this.formModel || [])),formLogic: JSON.parse(JSON.stringify(this.formLogic || {})),formData: JSON.parse(JSON.stringify(this.formData || {}))
};
console.log('最大化弹窗数据', this.maximizeDialog);
  • 原理:maximizeDialog在赋值后,如上,如果没有深拷贝只是向下面一样赋值, 则会出现丢失数据问题。我认为的原因是在maximizeDialog这个json中如果这样写就只是做到了较浅的响应式引用
formModel: this.formModel,
formLogic: this.formLogic,
formData: this.formData

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:http://www.pswp.cn/web/97899.shtml
繁体地址,请注明出处:http://hk.pswp.cn/web/97899.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

经典俄罗斯方块游戏 | 安卓三模式畅玩,暂时无广告!

大家好,今天想跟大家分享一款安卓版的俄罗斯方块游戏。适合无聊的时候玩玩,换换脑子,这款游戏太经典。80、90都玩过这个游戏。之前我也给大家推荐过一些离线小游戏,但有些用着用着就开始出现弹窗广告,这就有点烦&#…

今天开始学习新内容“服务集群与自动化”--crond服务、--syslog服务以及DHCP协议

一.crond简介1、基本介绍crond是linux下用来周期性的执行某种任务或等待处理某些事件的一个守护进程,与windows下的计划任务类似,当安装完成操作系统后,默认会安装此服务工具,并且会自动启动crond进程,crond进程每分钟…

从go语言出发,搭建多语言云原生场景下全链路观测体系

一、方案背景 在公司内部devops平台的微服务化改造过程中,我们遇到了典型的分布式系统观测难题:服务间调用链路复杂、性能瓶颈难以定位、故障排查效率低下。特别是在生产环境出现问题时,往往需要花费大量时间在各个服务的日志中寻找蛛丝马迹。…

Vue 进阶实战:从待办清单到完整应用(路由 / 状态管理 / 性能优化全攻略)

Vue 进阶实战:从待办清单到完整应用(路由 / 状态管理 / 性能优化全攻略) 在上一篇博客里,我们一起实现了能本地存储的待办清单,不少朋友留言说:“学会了基础,但遇到‘登录后才能访问页面’‘多…

uniApp开发XR-Frame微信小程序 | 动态加载与删除模型

在使用xr-frame开发3D小程序时,我们经常需要根据需求去动态加载模型或删除模型,在官方的说明中,提到了相关方法,但并不太明确,也没有确切的实例。 我们先来看一下官方给出的说明。 一. Shadow元素 我们需要用代码动…

把多个 PPT 合并在一起,三步告别复制粘贴

制作部门汇报分册、项目阶段文件等工作需要将多个零散的PPT合并为一份完整文档。手动复制粘贴不仅效率低下,还容易导致格式错乱、动画丢失。本文介绍一种高效方法,三步操作即可将多个PPT文件快速合并为单一文档。无论是整合汇报材料,还是准备…

安卓旋转屏幕后如何防止数据丢失-ViewModel入门

Android ViewModel 入门教程 在日常开发中,当 Activity 因为旋转屏幕或内存回收被销毁重建时,UI 中的数据也会丢失。 这时候,Android Jetpack 提供的 ViewModel 就能帮我们解决这个问题。 1. 什么是 ViewModel ViewModel 是一种架构组件。它专…

Linux 下的 Vim 使用与网络安全配置详解

目录 引言 一、Vim 编辑器的使用 1. Vim 的模式 2. 常用操作命令 3. 保存与退出 4. 多窗口与 Shell 切换 二、Linux 网络基础 1. 网络分类 2. IP 地址与分类 三、网络配置与工具 1. ifconfig 2. netstat 3. wget 4. 主机名与 IP 映射 四、Linux 防火墙与安全设置…

Docker 容器传输文件的常用方法

Docker 容器传输文件的常用方法 在 Docker 日常使用中,经常需要在主机与容器之间传输文件(如配置文件、代码包、日志等)。以下是四种最常用的实现方式,覆盖临时传输、持久共享、构建集成等不同场景。 1. 使用 docker cp 命令&…

视频转音频在线工具大比拼,哪家体验更胜一筹?

最近工作上遇到了个挺有意思的需求,需要从几个教学视频里提取出音频内容,方便做成播客形式,让学员能随时随地学习。一开始,我以为这活儿挺简单的,不就是把视频里的声音单独弄出来嘛,结果一上手才发现&#…

KafKa02:Kafka配置文件server.properties介绍

一、配置文件位置二、配置文件介绍默认下:9092 是处理消息队列核心业务(客户端与 broker 交互)的端口9093 是集群内部控制器通信的端口# 指定节点角色,这里同时作为 broker(消息代理)和 controller&#xf…

哈尔滨云前沿服务器租用托管

黑龙江前沿数据,始建于2005年,多年的历史,专业从事域名注册,虚拟主机,服务器租用,云主机,网站建设等互联网服务。电信/联通/双线/机房/众多机房供您选择,总有一个适合您的服务器&…

Qt开发经验 --- Qt 修改控件样式的方式(16)

文章目录[toc]1 概述2 Qt Style Sheets (QSS)3 使用 QStyle 和 QProxyStyle4 设置 Palette (调色板)5 使用预定义的 QStyle6 直接设置控件属性7 自定义控件绘制更多精彩内容👉内容导航 👈👉Qt开发经验 👈1 概述 Qt 提供了多种修改…

Vue3》》Svg图标 封装和使用

SVG 安装插件 npm i vite-plugin-svg-icons // vite.config.ts import { defineConfig } from vite import vue from vitejs/plugin-vue import { createSvgIconsPlugin } from vite-plugin-svg-icons import { resolve } from path export default defineConfig({//配置路径别…

【04】AI辅助编程完整的安卓二次商业实战-寻找修改替换新UI首页图标-菜单图标-消息列表图标-优雅草伊凡

【04】AI辅助编程完整的安卓二次商业实战-寻找修改替换新UI首页图标-菜单图标-消息列表图标-优雅草伊凡引言本次二开布局没有变,但是下一次整体布局会有变,不过本次开发发现朋友圈跳转功能的流程步骤也做了一定的变化。原生项目复杂就复杂于就算一个颜色…

龙蜥8.10中spark各种集群及单机模式的搭建spark3.5.6(基于hadoop3.3.6集群)

先说最终的访问端口,如我这里ip为172.20.94.37、172.20.94.38、172.20.94.39,主机名分别为:hadoop37、hadoop38、hadoop39. 最终访问(默认端口): hadoop webui 172.20.94.37:9870 hdfs 端口 8020 yarn 172.…

关于我重新学习 react 的第一遍

今天是25年9月11号,很久很久没有学习前端知识了,坦诚来说还清楚记得在大学里因为前端技术第一次获奖的心情,也清晰记得写完第一篇博客后的心情,工作和运动给我最大程度的成就感。 打破自己 重新开始 完全地 版本一 25.9.11 文章目…

第2课:Agent系统架构与设计模式

第2课:Agent系统架构与设计模式 课程目标 理解Agent的基本概念和特性掌握多Agent系统的设计模式学习Agent通信协议和消息传递实践创建简单的Agent框架 课程内容 2.1 Agent基础概念 什么是Agent? Agent是一个具有自主性、反应性、社会性和主动性的计…

Day42 51单片机中断系统与8×8 LED点阵扫描显示

day42 51单片机中断系统与88 LED点阵扫描显示一、51单片机引脚位操作 —— sbit 关键字 作用 sbit 是专用于 51 单片机架构的 C 语言扩展关键字,用于定义特殊功能寄存器(SFR)中的某一位,从而实现对单个 I/O 引脚的直接位操作。 示…

差分: 模板+题目

题目:【模板】差分 应用场景:快速解决将某一个区间所有元素加上 “一个数” 的操作。 第一步,预处理差分数组。 f[i] 表示:当前元素与前一个元素的差值 a[i] - a[i-1]; 但在题目中,我们其实可以不用到a[]这个数组…