vue-$set修改深层对象的值

背景:

点击编辑按钮,打开修改预算的抽屉,保存后更新此行数据的预算,以前是调接口刷新表格,这次的数据是由前端处理更新,由于数据层级比较深,使用$set来修改两层嵌套对象

使用方法:

this.$set( target, key, value )

  • target:要更改的数据源(可以是对象或者数组)
  • key:要更改的具体数据
  • value :重新赋的值 
 方法1

我刚试了一下,发现这样链式到要修改的对象也能生效

因为这个页面我有不同的抽屉,currentName代表我修改的那个表格,currentIndex代表要修改那一行。所以【target】其实为 this.tableData[2].crowd,【key】是预算值budget,【value 】是修改值。可以根据自己的结构来处理

this.$set(this[this.currentName][this.currentIndex].crowd, 'budget', value)
方法2

先把当前那一行的预算值修改了,再修改整个表格中当前索引的值,注意,这里必须要把扩展当前行的其他值,不然整个行只有crowd这个对象了。

this.$set(this.currentRow, 'budget', value)
this.$set(this[this.currentName],this.currentIndex,{
    ...this[this.currentName][this.currentIndex],
    crowd: this.currentRow
})

 

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

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

相关文章

python - DataFrame查询数据操作

学习目标 掌握获取df一列或多列数据的方法 知道loc和iloc的区别以及使用方法 知道df的query函数的使用方法 知道isin函数的作用和使用方法 获取DataFrame子集的基本方法 1.1 从前从后获取多行数据 案例中用到的数据集在文章顶部 LJdata.csv 前景回顾 head() & tail(…

opencv实战小结-银行卡号识别

实战1-银行卡号识别 项目来源:opencv入门 项目目的:识别传入的银行卡照片中的卡号 难点:银行卡上会有一些干扰项,如何排除这些干扰项,并且打印正确的号码是一个问题 最终效果如上图 实现这样的功能需要以下几个步骤…

JDK7 JDK8 JDK9接口中的默认方法、静态方法、私有方法

JDK8开始之后接口新增的方法 JDK7以前:接口中只能定义抽象方法 JDK8的新特性:接口中可以定义有方法体的方法(默认、静态) JDK9的新特性:接口中可以定义私有方法 接口中的默认方法InterA package com.itheima.a06;p…

IO进程线程(十)进程间通信 消息队列 共享内存 信号灯集

文章目录 一、IPC(Inter-Process Communication)进程间通信相关命令 :(一)ipcs --- 查看IPC对象(二)获取IPC键值(三)删除IPC对象的命令(四)获取IPC键值的函数1. 函数定义…

C++基础与深度解析 | 模板 | 函数模板 | 类模板与成员函数模板 | concepts | 完美转发 | 模板的其他内容

文章目录 一、函数模板二、类模板与成员函数模板三、Concepts(C20)四、模板相关内容1.数值模板参数与模板模板参数2.别名模板与变长模板3.包展开与折叠表达式4.完美转发与lambda表达式模板5.消除歧义与变量模板 一、函数模板 在C中,函数模板是一种允许你编写可以处理…

在Windows上安装VMWare Pro 16.2(虚拟机)并从零安装CentOS 7.6镜像过程记录

本文详细记录了在Windows的VMWare Workstation Pro 16.2中安装CentOS 7.6 的过程,非常适合新手从零开始一步步安装。 文章目录 一、安装VMWare Workstation Pro 16.2并激活二、安装CentOS 7.62.1 下载CentOS7.6镜像文件2.2 创建新的虚拟机2.3 安装CentOS镜像一、安装VMWare Wo…

國際知名榮譽顧問加入台灣分析集團總部,全面升級量子電腦Q系統

近期,國際知名的榮譽顧問正式加入台灣分析集團總部,利用相同的量子數據規格訊息數據庫,進行全方位的系統升級。此次升級後,量子電腦Q系統的精確預測和迅速反應能力提升了3.29%。透過高級的數據處理和技術分析,社群用戶將在瞬息萬變的市場中保持領先地位。 “量子電腦Q系統”由資…

C语言字符、数组指针变量

目录 一、字符指针变量 二、数组指针变量 a.数组指针变量是什么 b.数组指针变量的书写格式 c.数组指针变量如何初始化 d.二维数组传参的本质 一、字符指针变量 在指针的类型中我们知道有一种指针类型为字符指针 char* 。 其一般使用: int main() {char ch w…

【MySQL数据库】my.ini文件参数中文注释

😎 作者介绍:我是程序员洲洲,一个热爱写作的非著名程序员。CSDN全栈优质领域创作者、华为云博客社区云享专家、阿里云博客社区专家博主。 🤓 同时欢迎大家关注其他专栏,我将分享Web前后端开发、人工智能、机器学习、深…

LLM的基础模型7:Positional Encoding

大模型技术论文不断,每个月总会新增上千篇。本专栏精选论文重点解读,主题还是围绕着行业实践和工程量产。若在某个环节出现卡点,可以回到大模型必备腔调或者LLM背后的基础模型新阅读。而最新科技(Mamba,xLSTM,KAN)则提…

数据结构笔记1 绪论,线性表

学习视频: 第01周c--1.2基本概念和术语1_哔哩哔哩_bilibili 01《数据结构》绪论_哔哩哔哩_bilibili 数据: 1.数值型的数据:整数,实数 2.非数值型的数据:文字、图像.. 数据元素:(元素&#xf…

给孩子的端午节礼物:最新初中数学思维导图大合集+衡水高考学霸笔记,可下载打印!

大家好哇!端午节到了,阿星给家里有孩子的伙伴们一份礼物哦!今天给大家带来一个超级实用的学习神器——思维导图法,最新版的初中数学思维导图大合集! 这可不是我吹哦,连哈佛、剑桥大学都在用的高级学习方法…

JavaScript事件监听之其它事件(页面加载事件、元素滚动事件、页面尺寸事件、M端事件)

目录 1. 页面加载事件(load、DOMContentLoaded)2. 元素滚动事件(scroll)3. 页面尺寸事件3.1 resize3.2 获取元素宽高3.3 获取元素位置(offsetLeft和offsetTop、getBoundingClientRect) 4. M端事件 1. 页面加载事件(load、DOMContentLoaded) load事件: 使用场景: 等…

JVM 虚拟机

JVM 是 Java Virtual Machine 的简称,意为 Java 虚拟机,虚拟机是指通过软件模拟的具有完整硬件功能的、运行在一个完全隔离的环境中的完整计算机系统。 常见的虚拟机有:JVM、VMwave、Virtual Box等。JVM 是一台被定制过的现实当中不存在的计算…

流量录制学习

AREX Cloud | AREX (arextest.com) 流量录制学习,比vivo的moonbox要好用

【QT5】<总览四> QT常见绘图、图表及动画

文章目录 前言 一、QFile类读写文件 二、QPainter绘简单图形 三、QChart图表 四、QPropertyAnimation属性动画 五、Q_PROPERTY宏简介 六、自定义属性动画 前言 承接【QT5】<总览三> QT常用控件。若存在版权问题,请联系作者删除&#…

C语言过度C++语法补充(面向对象之前语法)

目录 1. C相较于C语言新增的语法 0. C 中的输入输出 1. 命名空间 1. 我们如何定义一个命名空间? 2. 如何使用一个命名空间 3. 命名空间中可以定义什么? 4. 在 相同或者不同 的文件中如果出现 同名的命名空间 会如何? 5. 总结~~撒花~~…

社区服务支持

社区服务支持 原创 小王搬运工 时序课堂 2024-06-07 19:29 四川 🌟 邀请函 | 加入我们的时序数据挖掘社区 🚀 尊敬的数据爱好者们, 我们诚挚地邀请您加入我们的专业社区——时序数据挖掘社区,一个专注于时序数据分析、挖掘与应…

网络空间安全数学基础·同余式

6.1 剩余系&#xff08;掌握&#xff09; 6.2 同余式概念与一次同余式&#xff08;熟练&#xff09; 6.3 中国剩余定理&#xff08;熟练&#xff09; 6.1 剩余系 设m是正整数&#xff0c;模m同余的全体整数是一个模m剩余类&#xff0c;即可表示为a qmr&#xff0c; 0≤r<…

ssti模板注入

一、Flask应用 1、介绍 定义 Flask&#xff1a;是一个使用Python编写的轻量级web应用框架。Flask基于Werkzeug WSGI工具包和Jinja2模板引擎。 特点 良好的文档、丰富的插件、包含开发服务器和调试器、集成支持单元测试、RESTful请求调度、支持安全cookies、基于Unicode。 …