Vue内嵌套层级过深,el-input改变值视图无响应

出现场景

1.v-for内绑定复杂类型数据内部值,通过input更改其值时。 2.element表单或表格等组件内部,el-input绑定复杂类型数据内部值,通过input更改其值时。

解决思路

1.el-input加入

@input="change($event)"

...

import { getCurrentInstance } from "vue";

const { proxy, ctx:that } = getCurrentInstance()

const change = (e) => { that.$forceUpdate(); }

2.如果不行,改进change方法

const change = (e) => {

let a = JSON.parse(JSON.stringify(dataLists))

dataLists = a;

that.$forceUpdate();

}

3.还不行,改进dataLists结构

let dataLists = reactive({ data: [] });

所有引用地方改为dataLists.data

相关推荐
不要再敲了39 分钟前
JavaScript与jQuery:从入门到面试的完整指南
javascript·面试·jquery
xiaoyan20151 小时前
Electron38-Winchat聊天系统|vite7+electron38+vue3电脑端聊天Exe
vue.js·electron·vite
reembarkation2 小时前
使用pdfjs-dist 预览pdf,并添加文本层的实现
前端·javascript·pdf
reembarkation2 小时前
vue-pdf 实现blob数据的预览
javascript·vue.js·pdf
李明卫杭州2 小时前
JavaScript中的dispatchEvent方法详解
javascript
给月亮点灯|2 小时前
Vue3基础知识-setup()、ref()和reactive()
前端·javascript·vue.js
芜青2 小时前
【Vue2手录12】单文件组件SFC
前端·javascript·vue.js
Martin-Luo2 小时前
Vue3 通过json配置生成查询表单
javascript·vue.js·json
梦想CAD控件2 小时前
(在线CAD平台)网页集成CAD SDK的方法
前端·javascript·github
掘金约基奇_2 小时前
JS-SDK开发企微侧边栏
前端·javascript