el-table列表修改某个输入框输入 卡顿问题修改

卡顿的代码:

复制代码
 <!-- <el-input
                     v-else
										v-model="table.data[$index].watermeterCode"
										:disabled="handleType === 'detail' || !row.isEdit"

									></el-input> -->修改

解决的办法:

复制代码
handleInput(index, field, value) {

      this.$set(this.table.data[index], field, value)
      // console.log(this.table.data[index])
    },
复制代码
<el-table-column
								label="水表编号"
								prop="watermeterCode"
								show-overflow-tooltip
								width="90"
							>
								<template v-slot:header>
									<span class="warn">*</span>
									<span>水表编号</span>
								</template>
								<template v-slot="{ row , $index}">

                   <span v-if="handleType === 'detail' || !row.isEdit">{{ row.watermeterCode }}</span>
              
                  <el-input
                      :key="row.id"
                      :ref="'nextNumInput-' + row.$index"
                      :controls="false"
                      :precision="0"
                      placeholder="请输入"
                      v-model="row.watermeterCode"
                       @blur="(event) => handleInput($index, 'watermeterCode', event.target.value)"
                    >
                    </el-input>
								</template>
							</el-table-column>
相关推荐
dy171716 小时前
vue2树节点刷新后定位到上一节点展开
vue.js
高级程序源20 小时前
django大学生创新创业项目管理系统94923-计算机课程设计、毕业设计
javascript·vue.js·spring boot·后端·python·django·课程设计
lizz227620 小时前
Babel插件手册
javascript
VXbishe1 天前
【课程设计】基于SpringBoot的乡村政务服务系统的设计与实现-计算机毕设77011
javascript·vue.js·spring boot·python·php·课程设计·政务
志尊宝1 天前
Vue3 零基础每日笔记(037):动手封装 useMouse 与 useWindowSize——事件监听的标准模板
前端·javascript·vue.js·笔记·html5
shmily麻瓜小菜鸡1 天前
TDD(测试驱动开发)详解
开发语言·javascript·typescript·node.js·ecmascript
BillKu1 天前
vue3双向邦定:使用defineModel替换defineProps+defineEmits
vue.js
wcy03101 天前
POST为什么会发送两次请求
javascript·ajax
志尊宝1 天前
Vue3 零基础每日笔记(047):动态路由与路由参数——:id 传参、query 传参、props 解耦
前端·javascript·vue.js·笔记·html5
计算机毕设定制辅导-无忧学长1 天前
《基于SpringBoot的中学教师数字胜任力测评网站的设计与实现》
java·vue.js·spring boot·mysql·中学教师数字胜任力测评网站