element dialog 2层弹窗数据同步问题

注意:本帖为公开技术贴,不得用做任何商业用途

element dialog 2层弹窗数据同步问题

如果嵌套dialog,也就是多层dialog嵌套

2个input,key用同样的值

会导致内外2层dialog,用相同key值的input会数据同步

原因如下:

根据elementUI的文档
在这里插入图片描述

外层本就挂载在body上,嵌套的dialog也挂载在body上了,那么就有2个相同key值的input,所以修改内层dialog的时候,外层的dialog相同key值的input就会数据同步

解决,2个input取不用的v-model值(key值)即可

比如

<el-input v-model="formData.name" placeholder="名称"></el-input>

内外2层dialog不要有相同的formData.name,或者name

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

C# 属性 学习理解记录

字段和属性 左边字段&#xff0c;右边属性 拓展&#xff0c;属性安全&#xff1a; 1、设置public private 和protected 等&#xff0c;只读&#xff0c;只写&#xff0c; 2、在get set 方法时&#xff0c;验证&#xff0c;异常时抛出错误

如何提取某站 MV 视频中的音乐为 MP3 音频

我们常常会遇到需要将视频中的音频提取出来并转换为 MP3 格式的情况&#xff0c;比如想要单独保存一段视频中的精彩音乐、演讲或旁白。简鹿视频格式转换器就是一款能够轻松实现这一需求的实用软件&#xff0c;它支持 Windows 和 Mac 系统&#xff0c;为不同操作系统的用户提供了…

SQLynx让数据库变得简单!

SQLynx让数据库管理和开发变得更简单&#xff0c;SQLynx是一款旨在简化飞客使用体验的创新型工具&#xff0c;它为数据库管理者、数据库分析师和开发人员提供了一个直观、易用、高效的平台&#xff0c;首先&#xff0c;SQLynx拥有直观友好的用户界面。无论您是新建还是导表&…

stm32f10x_tim.h(函数学习自用)

stm32f10x_tim.h 函数库 void TIM_TimeBaseInit(TIM_TypeDef* TIMx, TIM_TimeBaseInitTypeDef* TIM_TimeBaseInitStruct); //时基单元配置void TIM_OC1Init(TIM_TypeDef* TIMx, TIM_OCInitTypeDef* TIM_OCInitStruct); void TIM_OC2Init(TIM_TypeDef* TIMx, TIM_OCInitTypeDe…

Centos Stream 9安装Jenkins-2.485 构建自动化项目步骤

官网&#xff1a;https://www.jenkins.io/ 1 下载 环境准备&#xff1a; 版本支持查询&#xff1a;https://pkg.jenkins.io/redhat-stable/ 安装JDK17&#xff1a;https://blog.csdn.net/qq_44870331/article/details/140784297 yum -y install epel-release wget upgradew…

ubuntu修改成静态ip

先用ifconfg查询网卡名称 例如以下的是enp10s0 enp10s0: flags4163<UP,BROADCAST,RUNNING,MULTICAST> mtu 1500inet 192.168.100.159 netmask 255.255.255.0 broadcast 192.168.100.255inet6 fe80::127c:61ff:fe4c:ab6b prefixlen 64 scopeid 0x20<link>ether…

Canvas 前端艺术家

目前各种数据来看&#xff0c;前端未来在 数据可视化 和 AI 这两个领域会比较香&#xff0c;而 Canvas 是 数据可视化 在前端方面的基础技术。所以给大家唠唠Canvas这个魔幻工具。 Canvas 介绍 Canvas 中文名叫 “画布”&#xff0c;是 HTML5 新增的一个标签。Canvas 允许开发…

WEB攻防-通用漏洞文件上传二次渲染.htaccess变异免杀

知识点&#xff1a; 1、文件上传-二次渲染 2、文件上传-简单免杀变异 3、文件上传-.htaccess妙用 4、文件上传-PHP语言特性 1、上传后门时&#xff0c;文件内容带.就不行 这时可以上传一个转换后的ip地址&#xff0c;ip地址对应网站包含后门代码 转换后的int会在访问的时候…

Linux驱动开发(9):pinctrl子系统和gpio子系统--led实验

在前面章节&#xff0c;我们有过使用寄存器去编写字符设备的经历了。这种直接在驱动代码中&#xff0c; 通过寄存器映射来对外设进行使用的编程方式&#xff0c;从驱动开发者的角度可以说是灾难。 因为每当芯片的寄存器发生了改动&#xff0c;那么底层的驱动几乎得重写。 那么…

Element-Ui组件(icon组件)

一、前言 本篇文章主要是对官网的Icon组件进行总结归纳Icon 图标 | Element Plus 在现代Web应用开发中&#xff0c;图标是用户界面设计中不可或缺的一部分。它们不仅提升了用户体验&#xff0c;还使得信息的传达更加直观和高效。本文主要对Element Plus 官方提供的Icon组件进行…

Echarts+VUE饼图的使用(基础使用、多个饼图功能、单组饼图对应颜色使用)

安装&#xff1a;npm install echarts --save 配置:main.js // 引入echarts import * as echarts from echarts Vue.prototype.$echarts echarts一、基础饼图&#xff08;直接拷贝就能出效果&#xff09; <div class"big-box" ref"demoEhart"><…

文件管理 II(文件的物理结构、存储空间管理)

一、文件的物理结构 文件实际上是一种抽象数据类型&#xff0c;我们要研究它的逻辑结构、物理结构&#xff0c;以及关于它的一系列操作。文件的物理结构就是研究文件的实现&#xff0c;即文件数据在物理存储设备上是如何分布和组织的。同一个问题有两个方面的回答&#xff1a;…

半导体、晶体管、集成电路、芯片、CPU、单片机、单片机最小系统、单片机开发板-概念串联辨析

下面概念定义从小到大串联&#xff1a; 半导体&#xff08;semiconductor&#xff09;&#xff1a; 是一类常温下导电性能介于导体与绝缘体之间的材料&#xff0c;这种材料的导电性可以随着外部环境比如电压、温度、光照的变换而改变。常见的半导体材料有硅、锗、砷化镓等。 晶…

【Z240001】基于SpringBoot+Vue实现的酒店管理系统的设计与实现

基于SpringBootVue实现的酒店管理系统的设计与实现 1. 项目描述2. 运行环境3.界面展示4.源码获取 1. 项目描述 基于SpringBootVue实现的酒店管理系统设计了管理员、员工、用户三种角色。 前台界面里游客和已经登录的用户可以浏览客房信息、公告信息等&#xff0c;已经登录的用…

【计算机网络】解决bind error

服务器有时可以立即重启&#xff0c;有时候无法立即重启 — bind error 首先要知道&#xff1a;四次挥手动作完成之后&#xff0c;主动断开连接的一方要维持一段时间的TIME_WAIT bind error原因&#xff1a;因为是服务器主动断开的&#xff0c;所以服务器要去维持TIME_WAIT状…

爬虫实战:采集知乎XXX话题数据

目录 反爬虫的本意和其带来的挑战目标实战开发准备代码开发发现问题1. 发现问题[01]2. 发现问题[02] 解决问题1. 解决问题[01]2. 解决问题[02] 最终结果 结语 反爬虫的本意和其带来的挑战 在这个数字化时代社交媒体已经成为人们表达观点的重要渠道&#xff0c;对企业来说&…

关于相机选型的一些参数说明

上一篇&#xff1a;关于相机的一些参数计算&#xff08;靶面、视野等&#xff09; 目录 1.卷帘快门和全局快门1.1 卷帘快门1.2 全局快门PS&#xff1a;视觉伺服与快门选择 2.黑白和彩色3.CCD和CMOS3.1 CCD3.2 CMOSCCD VS CMOS 4.面阵和线扫4.1 面阵4.2 线扫4.3 面阵 VS 线扫 5.…

使用 helm 部署 gitlab

一、下载 Gitlab chart 进入 artifacthub 官网 选择你想要的版本&#xff08;我选择的chart版本是 8.4.0 , gitlab 版本是17.4.0 &#xff09; 进入到控制台&#xff0c;添加helm仓库 如果你想不改任何配置&#xff0c;你可以执行安装命令&#xff0c;等待安装即可helm instal…

React (三)

文章目录 项目地址十二、性能优化12.1 使用useMemo避免不必要的计算12.2 使用memo缓存组件,防止过度渲染12.3 useCallBack缓存函数12.4 useCallBack里访问之前的状态(没懂)十三、Styled-Components13.1 安装13.2给普通html元素添加样式13.3 继承和覆盖样式13.4 给react组件添…

win10局域网加密共享设置

1、创建共享账户 我的电脑右键选择管理 选择本地用户和组 -> 用户 双击用户 在空白区域右键,新建用户 然后创建用户 点击创建后 2、设置网络 右下角网络右键