vue中对象的赋值Object.assign({}, row)方式

目录
  • 对象的赋值Object.assign({},row)
  • Object.assign()需要注意的一个小知识点

对象的赋值Object.assign({}, row)

复制功能，想单独去掉id不传过去，思路设置局部变量，把整个row对象赋值给newData变量，使用 Object.assign({}, row)；使用delete方法删除newData中的id

copyStep(index,row){
        // 将对象赋值给一个变量
        let newData = Object.assign({}, row)
        delete newData.id
        将处理完的变量传给下面的两个方法
        this.addStep(index,newData);
        this.showEditDialog(index + 1,newData,true);
      },

Object.assign()需要注意的一个小知识点

当使用object.assign()，原对象会发生改变怎么办？

如图，原对象obj也会发生改变，如果不想要原对象obj发生改变，可以采用如下的方法，让传入的第一个参数为空时，则原对象不发生改变

以上为个人经验，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • vue data对象重新赋值无效(未更改)的解决方式

    vue存在一个比较深的问题就是data中的属性对象如果在初始化的时候为{},那么后面在方法用普通的js语法赋值会无效 这里是data data() { return { model: {} }; } 这里是方法里的普通赋值 afterUpload(response) { this.model.icon = response.url; } 普通方法会无效,需要使用vue提供的方法重新显示声明 afterUpload(response) { this.$set(this.model,'icon',r

  • 对VUE中的对象添加属性

    背景:在通过接口获取数据集对象后,根据业务场景需要在数据集对象上增加额外的属性 data中定义的数据集对象mindData格式示例如下 mindData: [ {label:'清醒',value:'清醒'}, {label:'朦胧',value:'朦胧'}, {label:'嗜睡',value:'嗜睡'}, {label:'昏睡',value:'昏睡'}, {label:'谵妄',value:'谵妄'}, {label:'模糊',value:'模糊'}] 1) 通过post调用接口获取minDa

  • Vue对象赋值视图不更新问题及解决方法

    当我们需要对vue里面data数据做动态更新. 如下,实例化了Vue对象,其下vueData为data属性指向,现在我们需要由后台装载完整的data对象 现在我们需要装载更新完整的data对象,常规的赋值方式并不会引起视图的更新,双向绑定会失效. 如上图中默认broker_list为空对象,装载完之后broker_list 包含新项(ZY98) 解决办法: $.each(clientData, function (k, v) { Vue.set(vueData,k,Object.assign({

  • vue 数组和对象不能直接赋值情况和解决方法(推荐)

    Vue 不能检测以下变动的数组: 当你利用索引直接设置一个项时,例如:vm.items[indexOfItem] = newValue 当你修改数组的长度时,例如:vm.items.length = newLength 当第一种情况需求时,可以使用this.$set(this.arr,index,newVal) Vue 不能检测对象属性的添加或删除: 可以使用this.$set(this.person,'age',12) 当需要添加多个对象时,Object.assign({},this.pers

  • Vue响应式添加、修改数组和对象的值

    Vue响应式添加、修改数组和对象的值

    有些时候,不得不想添加.修改数组和对象的值,但是直接添加.修改后又失去了getter.setter. 由于 JavaScript 的限制, Vue 不能检测以下变动的数组: 1. 利用索引直接设置一个项时,例如: vm.items[indexOfItem] = newValue 2. 修改数组的长度时,例如: vm.items.length = newLength 为了避免第一种情况,以下两种方式将达到像 vm.items[indexOfItem] = newValue 的效果, 同时也将触发状

  • vue中对象的赋值Object.assign({}, row)方式

    vue中对象的赋值Object.assign({}, row)方式

    目录 对象的赋值Object.assign({},row) Object.assign()需要注意的一个小知识点 对象的赋值Object.assign({}, row) 复制功能,想单独去掉id不传过去,思路设置局部变量,把整个row对象赋值给newData变量,使用 Object.assign({}, row):使用delete方法删除newData中的id copyStep(index,row){         // 将对象赋值给一个变量         let newData = Obj

  • Vue关于对象直接赋值的坑及解决

    Vue关于对象直接赋值的坑及解决

    目录 Vue对象直接赋值的坑 Vue对象的赋值Object.assign({}, row) Vue对象直接赋值的坑 受JavaScript的限制,Vue不能监听到对象属性的添加或删除.如果这样做了,你会发现添加或删除的属性不是响应式的,即无法及时更新视图. 如果我们需要将a对象赋值给b对象时,要么把b对象的所有属性都在a对象中定义一下,要么 使用this.$set(this.object,key,value)将b对象中有a对象中没有的属性set进去,或者使用Object.assign(this.

  • 解决vue中对象属性改变视图不更新的问题

    常规情况下我们在vue实例的data中设置响应数据.但当数据为对象,我们增加或删除对象属性值时,视图并不触发更新,如何解决这个问题呢? 实例代码如下: let vm = new Vue{ el: '#app', data: { obj: { k: 'v' } }, ... } 有三种解决方案: 方案一:利用Vue.set(object,key,val) 例:Vue.set(vm.obj,'k1','v1') 方案二:利用this.$set(this.obj,key,val) 例:this.$se

  • JavaScript对象拷贝与Object.assign用法实例分析

    本文实例讲述了JavaScript对象拷贝与Object.assign用法.分享给大家供大家参考,具体如下: 深拷贝与浅拷贝 在 JavaScript 中,对于基本数据类型(undefined.null.boolean.number.string)来说,在变量中存储的就是这个变量本身的值,复制是对值的复制,不存在深浅之说.但C系语言的共同特点中有,存储引用类型(对象),实际中在变量里存的是它的地址.因此对 JavaScript 中的复杂数据类型(object)来说,也会有浅拷贝和深拷贝的概念:浅

  • vue中touch和click共存的解决方式

    在vue开发手机端项目时,我们经常会遇到touch和click共存的情况,比如城市选择页面的字母滑动 touch事件在手机端会触发浏览器滑动,所以应给touch事件添加阻止默认行为touchmove.prevent.注意阻止默认行为事件不要添加在touchstart事件上,会影响到click事件的发生. touch事件和click事件发生先后顺序: touchstart,touchmove,touchend,click 补充知识:touchstart与click同时触发 产生冲突的原因 我们可以

  • Vue中引入svg图标的两种方式

    Vue中引入svg图标的两种方式

    Vue中引入svg图标的方式 Vue中引入svg图标的方式一 安装 yarn add svg-sprite-loader --dev svg组件 index.vue <!-- svg组件 --> <template> <svg class="svg-icon" :class="svgClass" aria-hidden="true"> <use :xlink:href="iconName&quo

  • C++中对象的赋值与复制操作详细解析

    C++中对象的赋值与复制操作详细解析

    对象的赋值 如果对一个类定义了两个或多个对象,则这些同类的对象之间可以互相赋值,或者说,一个对象的值可以赋给另一个同类的对象.这里所指的对象的值是指对象中所有数据成员的值. 对象之间的赋值也是通过赋值运算符"="进行的.本来赋值运算符"="只能用来对单个的变量赋值,现在被扩展为两个同类对象之间的赋值,这是通过对赋值运算符的重载实现的. 实际上这个过程是通过成员复制来实现的,即将一个对象的成员值一一复制给另外一个对象的成员.对象赋值的一般形式: 对象名1=对象名2;

  • vue中data里面的数据相互使用方式

    vue中data里面的数据相互使用方式

    目录 data里面的数据相互使用 具体代码如下 data里的数据不能相互引用问题 data里面的数据相互使用 今天在写代码的时候,遇到一个问题,我想使用data里面的一个对象使用data里面的某个数据,附图片: 我想让active的值给params对象里面的topicListType使用,我不想直接在一个方法里面改变这个值(想改的话就直接可以改了,太简单),所以就有了这个想法. 在data里面使用,但是肯定不能写成 this.params.topicListType: this.active,这

  • 在vue中使用eacharts创建graph关系图方式

    目录 使用eacharts创建graph关系图 vue中关系图组件 1.Graph.vue 2.GraphDemo.vue 使用eacharts创建graph关系图 在最近的工作中遇到了这个问题一开始遇到遇到问题且网上现在的教程不那么详细于是想着自己写一个来记录一下. 首先想使用echarts先下载echarts包命令如下 npm install echarts --save 然后将eacharts引入到项目中,推荐在main.js引入. import * as echarts from 'ec

随机推荐