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

el-input 输入后失去焦点

说了是无情,写了更无情,你说你看了不点赞是不是更绝情?遇到这种神奇的BUG,也是大家无奈的神情。

来分析看代码:

<div class="card-item input-item" :class="{ 'w-100': followRadio === '2' }"v-for="(item,index) in  stageRounds " :key="item.name"><template v-if="!item.hidden"><el-input v-if="followRadio === '1'" class="w-100"v-model="item.name"></el-input><el-input v-else class="w-100 big-w" v-model="item.roundName"placeholder="请填写随访点名称"></el-input></template>
</div>

外面的v-for循环的key使用了元素的name属性,而恰好我们的name动态双向绑定给了input,故而在

input输入变化时触发了外层的刷新导致每输入一个字符后input失去焦点,影响输入。

修改方案如下:将:key赋值一个不变的值!避免动态刷新此dom!

 <div class="card-item input-item" :class="{ 'w-100': followRadio === '2' }"v-for="(item,index) in  stageRounds " :key="index"><template v-if="!item.hidden"><el-input v-if="followRadio === '1'" class="w-100"v-model="item.name"></el-input><el-input v-else class="w-100 big-w" v-model="item.roundName"placeholder="请填写随访点名称"></el-input></template>
</div>

相关文章:

el-input 输入后失去焦点

说了是无情&#xff0c;写了更无情&#xff0c;你说你看了不点赞是不是更绝情&#xff1f;遇到这种神奇的BUG&#xff0c;也是大家无奈的神情。 来分析看代码&#xff1a; <div class"card-item input-item" :class"{ w-100: followRadio 2 }"v-for&…...

docker创建并访问本地前端

docker创建并访问本地前端&#xff0c;直接上命令&#xff1a; 安装nginx镜像&#xff1a; docker pull nginx 查看已安装的nginx&#xff1a; docker images 创建DockerFile文件&#xff0c;直接在当前文件夹种创建 touch Dockerfile 在Dockerfile写入内容&#xff1a; F…...

数据结构之单链表基本操作

&#x1f937;‍♀️&#x1f937;‍♀️&#x1f937;‍♀️ 今天给大家分享的是单链表的基本操作。 清风的个人主页 &#x1f389;欢迎&#x1f44d;点赞✍评论❤️收藏 &#x1f61b;&#x1f61b;&#x1f61b;希望我的文章能对你有所帮助&#xff0c;有不足的地方还请各位…...

Python 实践

文章目录 一、HttpRequests 一、Http Requests python——Request模块...

使用easyui前端框架快速构建一个crud应用

本篇文章将会详细介绍jquery easyui前端框架的使用&#xff0c;通过创建一个crud应用来带大家快速掌握easyui的使用。 easyui是博主最喜欢的前端框架&#xff0c;没有之一&#xff0c;因为它提供了多种主题&#xff0c;而且有圆润的各种组件。 一、快速开始 easyui的官网地址&…...

Logback从添加依赖,到配置给中打印级别,archive相关信息配置,在项目中的常见的用法,一个完整的过程

添加Logback依赖&#xff1a; 在您的Maven或Gradle项目中&#xff0c;添加Logback依赖。例如&#xff0c;在Maven中&#xff0c;可以将以下依赖添加到pom.xml文件中&#xff1a; <dependency><groupId>ch.qos.logback</groupId><artifactId>logback-c…...

虚假内容检测,谣言检测,不实信息检测,事实核查;纯文本,多模态,多语言;数据集整理

本博客系博主个人理解和整理所得&#xff0c;包含内容无法详尽&#xff0c;如有补充&#xff0c;欢迎讨论。 这里只提供数据集相关介绍和来源出处&#xff0c;或者下载地址等&#xff0c;因版权原因不提供数据集所含的元数据。如有需要&#xff0c;请自行下载。 “Complete d…...

数据结构:单链表

文章目录 &#x1f349;前言&#x1f349;基本概念&#x1f349;链表的分类&#x1f34c;单链表节点的结构&#x1f34c;创建节点&#x1f34c;打印链表&#x1f34c;插入和删除&#x1f95d;尾插&#x1f95d;头插&#x1f95d;尾删&#x1f95d;头删&#x1f95d;指定位置之前…...

官媒代运营:让大众倾听品牌的声音

在当今数字时代&#xff0c;媒体的影响力和多样性远远超出了以往的范畴。品牌和企业越来越依赖媒体来传播信息、建立声誉以及与大众互动。而媒体矩阵成为了现代品牌传播的关键策略&#xff0c;使大众能够倾听品牌的声音。媒体矩阵&#xff1a;多元化的传播渠道 媒体矩阵是指利…...

postgresql 实现计算日期间隔排除周末节假日方案

前置条件&#xff1a;需要维护一张节假日日期表。例如创建holiday表保存当年假期日期 CREATE TABLE holiday (id BIGINT(10) ZEROFILL NOT NULL DEFAULT 0,day TIMESTAMP NULL DEFAULT NULL,PRIMARY KEY (id) ) COMMENT假期表 COLLATEutf8mb4_0900_ai_ci ;返回日期为xx日xx时x…...

金融工作怎么做?低代码如何助力金融行业

10月30日至31日&#xff0c;中央金融工作会议在北京举行。金融是国民经济的“血脉”&#xff0c;是国家核心竞争力的重要组成部分。会议指出&#xff0c;党的十八大以来&#xff0c;在党中央集中统一领导下&#xff0c;金融系统有力支撑经济社会发展大局&#xff0c;坚决打好防…...

基于springboot实现智慧外贸平台系统【项目源码+论文说明】计算机毕业设计

基于springboot实现智慧外贸平台系统演示 摘要 网络的广泛应用给生活带来了十分的便利。所以把智慧外贸管理与现在网络相结合&#xff0c;利用java技术建设智慧外贸平台&#xff0c;实现智慧外贸的信息化。则对于进一步提高智慧外贸管理发展&#xff0c;丰富智慧外贸管理经验能…...

带头+双向+循环链表

前言&#xff1a; 前面我们已经学习了单链表的结构及其功能特点&#xff0c;也了解了单链表在实现一些功能时出现的一些缺点&#xff0c;比如在删除某个节点前面一个节点时就需要再开一个变量来存放前面一个节点的信息&#xff0c;这样就显得不灵活&#xff0c;为了使链表实现功…...

Leetcode_2:两数相加

题目描述&#xff1a; 给你两个 非空 的链表&#xff0c;表示两个非负的整数。它们每位数字都是按照 逆序 的方式存储的&#xff0c;并且每个节点只能存储 一位 数字。 请你将两个数相加&#xff0c;并以相同形式返回一个表示和的链表。 你可以假设除了数字 0 之外&#xff…...

Pytorch实战教程(一)-神经网络与模型训练

0. 前言 人工神经网络 (Artificial Neural Network, ANN) 是一种监督学习算法,其灵感来自人类大脑的运作方式。类似于人脑中神经元连接和激活的方式,神经网络接受输入,通过某些函数在网络中进行传递,导致某些后续神经元被激活,从而产生输出。函数越复杂,网络对于输入的数…...

【MySQL】手把手教你centos7下载MySQL

centos7下载MySQL 前言正式开始卸载不需要的环境&#xff08;如果你之前没有安装过数据库相关的东西可以跳过&#xff09;下载mysql登录mysql登陆⽅法⼀【不⾏就下⼀个】登陆⽅法⼆【不⾏就下⼀个】登录方式三 前言 安装和卸载MySQL都用系统的root权限&#xff0c;更方便一点&…...

openlayers

OpenLayers使用_openlayers中文官网-CSDN博客...

力扣每日一道系列 --- LeetCode 88. 合并两个有序数组

&#x1f4f7; 江池俊&#xff1a; 个人主页 &#x1f525;个人专栏&#xff1a; ✅数据结构探索 ✅LeetCode每日一道 &#x1f305; 有航道的人&#xff0c;再渺小也不会迷途。 文章目录 思路1&#xff1a;暴力求解思路2&#xff1a;原地合并 LeetCode 88. 合并两个有序数组…...

Android Studio(项目收获)

取消按钮默认背景色 像按钮默认背景色为深蓝色&#xff0c;即使使用了background属性指定颜色也不能生效。 参考如下的解决方法&#xff1a; 修改/res/values/themes.xml中的指定内容如下&#xff1a; <style name"Theme.TianziBarbecue" parent"Theme.Mater…...

MQ写满的情况如何处理?

**MQ&#xff08;Message Queue&#xff09;**写满的情况通常指消息队列中的存储空间已经被用尽&#xff0c;无法再接收新的消息。处理MQ写满的情况涉及到多个方面&#xff0c;包括监控、调整配置、增加资源、以及处理积压消息等。下面是一些处理MQ写满的 常见方法&#xff1a;…...

从ELF Core File到内核虚拟内存:深入理解/proc/kcore如何‘伪造’一个128TB的巨型文件

解密Linux内核的魔法文件&#xff1a;/proc/kcore如何虚拟128TB内存镜像 当你第一次在终端输入ls -lh /proc/kcore时&#xff0c;可能会被那个惊人的128TB文件大小吓到——这比任何现有硬盘容量都大几个数量级。但更神奇的是&#xff0c;这个"庞然大物"实际上不占用任…...

终极指南:如何在Windows 10/11上完美修复ViPER4Windows音频增强工具

终极指南&#xff1a;如何在Windows 10/11上完美修复ViPER4Windows音频增强工具 【免费下载链接】ViPER4Windows-Patcher Patches for fix ViPER4Windows issues on Windows-10/11. 项目地址: https://gitcode.com/gh_mirrors/vi/ViPER4Windows-Patcher 厌倦了Windows 1…...

盟接之桥®电子数据交换EDI,如何用一套“数字桥梁”,让全球巨头主动为你敞开大门?

在全球经济一体化的宏大叙事下&#xff0c;中国制造业正站在历史的十字路口。从“中国制造”到“中国智造”&#xff0c;这不仅仅是称谓的更迭&#xff0c;更是产业链地位的跃迁。然而&#xff0c;在这条通往全球价值链高端的道路上&#xff0c;无数制造企业面临着同一个隐秘而…...

如何通过PDown百度网盘高速下载器免费突破限速:终极指南

如何通过PDown百度网盘高速下载器免费突破限速&#xff1a;终极指南 【免费下载链接】pdown 百度网盘下载器&#xff0c;2020百度网盘高速下载 项目地址: https://gitcode.com/gh_mirrors/pd/pdown PDown是一款完全免费的百度网盘高速下载工具&#xff0c;无需登录账号即…...

如何快速搭建Python管理后台:SQLAdmin终极解决方案

如何快速搭建Python管理后台&#xff1a;SQLAdmin终极解决方案 【免费下载链接】sqladmin SQLAlchemy Admin for FastAPI and Starlette 项目地址: https://gitcode.com/gh_mirrors/sq/sqladmin 你是否曾为FastAPI或Starlette项目的数据管理界面而烦恼&#xff1f;每次都…...

番茄小说下载器完整指南:永久保存心爱小说的终极解决方案

番茄小说下载器完整指南&#xff1a;永久保存心爱小说的终极解决方案 【免费下载链接】fanqienovel-downloader 下载番茄小说 项目地址: https://gitcode.com/gh_mirrors/fa/fanqienovel-downloader 还在为番茄小说中的精彩内容担心下架而烦恼吗&#xff1f;fanqienovel…...

2026 年 4 月深度复盘:Hermes Agent 开源潮下,悬镜灵境 AIDR 如何构建智能体安全 “全链路护城河”

一、2026 年 4 月 Hermes Agent 开源热点&#xff1a;技术跃迁与安全风险双重爆发近期&#xff0c;Nous Research 开源的Hermes Agent凭借 “自进化、动态技能生成、跨会话记忆” 核心能力&#xff0c;成为 AI 智能体领域顶流动量。其突破传统大模型 “单次推理” 局限&#xf…...

OpenCore-Configurator:如何通过图形化界面解决黑苹果配置的三大核心难题

OpenCore-Configurator&#xff1a;如何通过图形化界面解决黑苹果配置的三大核心难题 【免费下载链接】OpenCore-Configurator A configurator for the OpenCore Bootloader 项目地址: https://gitcode.com/gh_mirrors/op/OpenCore-Configurator OpenCore-Configurator&…...

智慧树视频学习自动化:如何用浏览器插件实现高效学习?

智慧树视频学习自动化&#xff1a;如何用浏览器插件实现高效学习&#xff1f; 【免费下载链接】zhihuishu 智慧树刷课插件&#xff0c;自动播放下一集、1.5倍速度、无声 项目地址: https://gitcode.com/gh_mirrors/zh/zhihuishu 还在为智慧树平台上的重复性操作而烦恼吗…...

如何3步打造电影级Minecraft画面:Revelation光影包完整配置指南

如何3步打造电影级Minecraft画面&#xff1a;Revelation光影包完整配置指南 【免费下载链接】Revelation An explorative shaderpack for Minecraft: Java Edition 项目地址: https://gitcode.com/gh_mirrors/re/Revelation 你是否厌倦了Minecraft中单调的光影效果&…...