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

vue3点击表格某个单元格文本就切换成输入框,其他单元格不变化

<el-table :data="data.tableData" height="60vh" border scrollbar-aways-on><el-table-column label="序号" type="index" width="80" fixed /><el-table-column label="操作" width="120" fixed><template #default="{ row }"><el-button type="danger" text @click="deleteBtn(row)" :disabled="row.status">删除</el-button><el-button style="color: #3592FF" text @click="enableBtn(row)">{{ row.status ? '停用' : '启用' }}</el-button></template></el-table-column><el-table-column prop="status" label="状态" width="120" /><el-table-column prop="phone" label="手机号" /><el-table-column prop="kanno" label="操作人" /><el-table-column prop="kanno" label="操作时间" /><el-table-column prop="kanno" label="创建人" /><el-table-column prop="createTime" label="创建时间" /><el-table-column label="姓名"><template #default="scope"><template v-if="scope.cellIndex == cellIndex && scope.$index == index"><el-input v-model="scope.row.status" @blur="saveCell" /></template><template v-else><div @click="editCell(scope, scope.$index)">{{ scope.row.status }}</div></template></template></el-table-column></el-table>
const cellIndex = ref('')
const index = ref('')function editCell(row, ind) {cellIndex.value = row.cellIndexindex.value = ind
}
function saveCell() {cellIndex.value = ''index.value = ''
}

效果如下

点击第一行的文本

点击第二行文本

相关文章:

vue3点击表格某个单元格文本就切换成输入框,其他单元格不变化

<el-table :data"data.tableData" height"60vh" border scrollbar-aways-on><el-table-column label"序号" type"index" width"80" fixed /><el-table-column label"操作" width"120" f…...

持续集成部署-k8s-资源调度:HPA - Pod 基于负载指标自动水平扩容缩容

首先我们找一个 Deployment 配置文件: nginx-deploy.yaml apiVersion: apps/v1 # deployment api 版本 kind: Deployment # 资源类型为 deployment metadata: # 元信息labels: # 标签app: nginx-deploy # 具体的 key: value 配置形式name: nginx-deploy...

RemObjects Elements 12.0 Crack

Elements 是一个现代多功能软件开发工具链。 它支持六种流行的编程语言&#xff1a;Oxygene (Object Pascal)、C#、Java、Mercury (Visual Basic.NET™)、Go 和 Swift&#xff0c;适用于所有现代平台。 使用 Elements&#xff0c;您可以为您喜欢的任何平台进行编程- 无论是单…...

STM32标准外设库下载(下载地址与步骤详解)

文章目录 1. 概述2. 官方下载地址3. 步骤详解3.1 打开官网3.2 工具与软件 ➡ 嵌入式软件 ➡ MEMS软件3.3 微控制器软件 ➡ STM32微控制器软件 ➡ STM32标准外设软件库 ➡ 选择产品系列3.4 选择版本 ➡ 点击下载3.5 点击“接受” ➡ 填写邮箱信息 ➡ 点击“下载”3.6 点击接收到…...

【912.排序数组】

目录 一、题目描述二、算法原理2.1快速排序2.2归并排序 三、代码实现3.1快排代码实现3.2归并代码实现 一、题目描述 二、算法原理 2.1快速排序 2.2归并排序 三、代码实现 3.1快排代码实现 class Solution { public:int getRandom(int left,int right,vector<int>&…...

【动态规划】583. 两个字符串的删除操作、72. 编辑距离

提示&#xff1a;努力生活&#xff0c;开心、快乐的一天 文章目录 583. 两个字符串的删除操作&#x1f4a1;解题思路&#x1f914;遇到的问题&#x1f4bb;代码实现&#x1f3af;题目总结 72. 编辑距离&#x1f4a1;解题思路&#x1f914;遇到的问题&#x1f4bb;代码实现&…...

Gradient conjugate priors and multi-layer neural networks

动机 先验参数 m , α , β , v m,\alpha,\beta,v m,α,β,v和随机变量 τ \tau τ KL散度的形式是&#xff1a; Dynamics of m , α , β , v m,\alpha,\beta,v m,α,β,v Dynamics of m , β , v m,\beta,v m,β,v for a fixed α \alpha α 绿色轨迹连接初始点和目标点…...

DistributedDataParallel数据不均衡

背景 在使用 DistributedDataParallel 进行数据并行训练时&#xff0c;每次反向传播都需要执行 all_reduce 操作以同步各个进程的梯度。all_reduce 需要进程组中的所有进程参与&#xff0c;如果某一个进程没有执行 all_reduce&#xff08;一个进程的输入较其他进程少&#xff…...

Cloud Studio连接MySQL,Access denied for一系列问题

官方文档有写如何安装Mysql $ apt update $ apt install mysql-server mysql-client -y$ service mysql start mysql -uroot -p123456进入MySQL命令行 问题出在连接数据库这一步&#xff0c;命令行能进去&#xff0c;但是数据库插件和代码都连不上 Access denied for 大概率…...

经典题型---旋转数组

经典题型—旋转数组 文章目录 经典题型---旋转数组一、题目二、代码实现 一、题目 给定一个整数数组 nums&#xff0c;将数组中的元素向右轮转 k 个位置&#xff0c;其中 k 是非负数。 示例 1: 输入: nums [1,2,3,4,5,6,7], k 3 输出: [5,6,7,1,2,3,4] 解释: 向右轮转 1 步…...

vue如何实现登录数据的持久化

Vue.js是一款流行的JavaScript框架&#xff0c;它可以帮助开发者构建高效且易于维护的单页面应用程序。在Vue.js中&#xff0c;实现登录数据的持久化是一个重要的任务&#xff0c;因为它可以帮助用户保持登录状态并避免频繁的登录操作。在本文中&#xff0c;我们将讨论Vue.js如…...

【Unity3D编辑器开发】Unity3D中实现Transform组件拓展,快速复制、粘贴、复原【非常实用】

推荐阅读 CSDN主页GitHub开源地址Unity3D插件分享简书地址我的个人博客 大家好&#xff0c;我是佛系工程师☆恬静的小魔龙☆&#xff0c;不定时更新Unity开发技巧&#xff0c;觉得有用记得一键三连哦。 一、前言 在开发中&#xff0c;常常会遇到频繁复制粘贴物体的坐标、旋转…...

求解仿射变换矩阵

仿射变换是图形学中经常用到的方法&#xff0c;通常但是仿射变换的系数是未知的&#xff0c;需要找到变换前后的三对对应点进行求解。 from affine import Affine import numpy as np参考文献 矩阵最小二乘法求解仿射变换矩阵 def solve_affine(init_points, goal_points) -&…...

【每日一题】—— 最大素因子

&#x1f30f;博客主页&#xff1a;PH_modest的博客主页 &#x1f6a9;当前专栏&#xff1a;每日一题 &#x1f48c;其他专栏&#xff1a; &#x1f534; 每日反刍 &#x1f7e1; C跬步积累 &#x1f7e2; C语言跬步积累 &#x1f308;座右铭&#xff1a;广积粮&#xff0c;缓称…...

【JavaEE】JUC 常见的类 -- 多线程篇(8)

JUC 常见的类 1. Callable 接口2. ReentrantLock3. 原子类4. 线程池5. 信号量 Semaphore6. CountDownLatch 1. Callable 接口 Callable Interface 也是一种创建线程的方式 Runnable 能表示一个任务 (run方法) – 返回 voidCallable 也能表示一个任务(call方法) 返回一个具体的…...

java项目运行时信息获取

大体思路如下&#xff0c;想要获取启动时处理器数量、jvm 相关信息&#xff0c;操作系统信息、运行机器信息 运行机器信息 import org.slf4j.Logger; import org.slf4j.LoggerFactory;import java.lang.invoke.MethodHandles;/*** 机器工具类*/ public abstract class ServerU…...

【LeetCode】71. 简化路径

1 问题 给你一个字符串 path &#xff0c;表示指向某一文件或目录的 Unix 风格 绝对路径 &#xff08;以 / 开头&#xff09;&#xff0c;请你将其转化为更加简洁的规范路径。 在 Unix 风格的文件系统中&#xff0c;一个点&#xff08;.&#xff09;表示当前目录本身&#xf…...

操作系统【OS】进程的控制【进程的创建、终止、阻塞、唤醒】

定义和过程 对应事件 创建 允许一个进程创建另一个进程允许子进程继承父进程所拥有的资源创建进程的过程如下&#xff1a; 申请一个空白的 PCB&#xff0c;并向 PCB 中填写一些控制和管理进程的信息&#xff0c;比如进程的唯一标识等&#xff1b;为该进程分配运行时所必需的…...

写一个简单的解释器(2) 构建标记流

确定标记类型 分为几个大类&#xff1a; 用户符号&#xff08;类型/标识符/数字/字符串…)关键字 (流程控制和定义符)括号 &#xff08;这里暂时认为 [] 属于括号&#xff09;分号 上述四类标记基本囊括了 vc \texttt{vc} vc 中的所有最小单元的类型&#xff0c;但是因为构…...

Leetcode1833. 雪糕的最大数量

Every day a Leetcode 题目来源&#xff1a;1833. 雪糕的最大数量 解法1&#xff1a;贪心 排序 本题唯一的难点在于计数排序。 计数排序详解&#xff1a;C算法之计数排序 为了尽可能多的买到雪糕&#xff0c;我们选择从价格低的雪糕开始买&#xff0c;统计能够买到的雪糕…...

Spring Boot项目里,如何正确使用JDK1.8 Optional配合@NotNull注解做接口参数校验?

Spring Boot中Optional与NotNull注解的优雅结合实践 在企业级应用开发中&#xff0c;接口参数的健壮性校验是保证系统稳定性的第一道防线。传统Java开发中&#xff0c;我们常常面临两种困境&#xff1a;要么是繁琐的if-else判空逻辑让代码变得臃肿&#xff0c;要么是漏判的空指…...

别再到处找资源了!一个百度网盘链接搞定IC设计EDA学习环境(附工艺库与避坑指南)

一站式IC设计学习环境&#xff1a;高效搭建EDA工具链的终极方案 在集成电路设计的学习道路上&#xff0c;无数初学者都曾陷入同样的困境——花费大量时间在论坛、网盘和各种资源站点间来回切换&#xff0c;只为拼凑出一个能用的EDA工具环境。当你终于下载完几十GB的安装包&…...

AI Compass前沿速览:聚焦 GPT-Image-2、Qwen3.6-Max-Preview、ClawLess 与 AgentScope Tuner

AI Compass前沿速览&#xff1a;聚焦 GPT-Image-2、Qwen3.6-Max-Preview、ClawLess 与 AgentScope Tuner 4月21日&#xff0c;OpenAI 在 ChatGPT 更新说明中宣布上线 ChatGPT Images 2.0&#xff1b;同日&#xff0c;开发者文档与定价页也同步出现 gpt-image-2。这意味着 GPT-…...

从 51 万行源码看 AI Agent 架构:Claude Code 设计哲学拆解

你有没有想过&#xff0c;一个 AI 编码 Agent&#xff0c;凭什么敢直接操作你的文件系统、执行 shell 命令、甚至帮你 git commit&#xff1f;它背后的架构到底长什么样&#xff0c;才能做到既强大又不失控&#xff1f; Anthropic 开源了 Claude Code 的完整源码&#xff0c;5…...

OpenFace 2.2.0:一站式开源面部行为分析工具完整指南

OpenFace 2.2.0&#xff1a;一站式开源面部行为分析工具完整指南 【免费下载链接】OpenFace OpenFace – a state-of-the art tool intended for facial landmark detection, head pose estimation, facial action unit recognition, and eye-gaze estimation. 项目地址: htt…...

2026年腾讯云入门流程:怎么部署OpenClaw?Coding Plan配置与大模型API Key教程

2026年腾讯云入门流程&#xff1a;怎么部署OpenClaw&#xff1f;Coding Plan配置与大模型API Key教程。OpenClaw&#xff08;前身为Clawdbot/Moltbot&#xff09;作为开源、本地优先的AI助理框架&#xff0c;凭借724小时在线响应、多任务自动化执行、跨平台协同等核心能力&…...

Hunyuan-MT Pro安全审计:本地部署杜绝数据出境与隐私泄露风险

Hunyuan-MT Pro安全审计&#xff1a;本地部署杜绝数据出境与隐私泄露风险 1. 为什么翻译数据安全如此重要 在日常工作和学习中&#xff0c;我们经常需要处理各种语言的文档和内容。无论是商业合同、技术文档、还是个人通信&#xff0c;这些材料往往包含敏感信息。传统的在线翻…...

机器学习训练的环境代价与可持续优化策略

1. 机器学习训练的环境影响现状2013年至2025年间&#xff0c;NVIDIA工作站显卡的运算效率&#xff08;GFLOPs/W&#xff09;提升了约100倍&#xff0c;但全球机器学习训练的总能耗却增长了近1000倍。这种看似矛盾的现象揭示了技术进步背后隐藏的环境代价。以典型的1750亿参数语…...

YOLOv8优化:注意力机制实战 | ECA模块轻量化集成与性能对比分析

1. 为什么需要给YOLOv8加注意力机制&#xff1f; 在目标检测领域&#xff0c;YOLOv8已经展现出强大的性能&#xff0c;但实际应用中我们经常会遇到一些棘手问题。比如在复杂场景下&#xff0c;模型可能会把路边的消防栓误检为行人&#xff0c;或者在夜间检测时对远处车辆的识别…...

Android12 展锐sl8541平台USB转串口驱动集成与SELinux权限实战解析

1. 硬件电路与引脚配置 在展锐sl8541平台上集成USB转串口功能&#xff0c;第一步需要确保硬件电路设计正确。Type-C接口的ID引脚连接到了CPU的KEYIN2/EXTINT4/GPIO126引脚&#xff0c;这个引脚的状态决定了USB的工作模式&#xff08;主机模式或设备模式&#xff09;。实际项目中…...