javascript - 将加载的对象复制到 Javascript 中的另一个对象

标签 javascript vue.js

<分区>

所以从标题本身。我有一个初始化对象,比如 say

"travellerDetails": { 
       "traveller_1": { 
              "Full Name": "", 
              "Gender": "", 
    }, "traveller_2": { 
             "Full Name": "", 
             "Gender": "",
    }, "traveller_3": { 
              "Full Name": "", 
              "Gender": ""
    } 
}

但是,当我从 Ajax 调用加载我的数据对象时

"travellerDetails": { 
           "traveller_1": { 
                  "Full Name": "John Doe", 
                  "Gender": "M", 
        }, "traveller_2": { 
                 "Full Name": "Jane Doe", 
                 "Gender": "F",
        }
    }, 

当我尝试将加载的数据存储到初始化对象时出现错误。

bookingForm.travellerDetails = data.travellerDetails;

考虑到加载时我只有 2 个旅行者,我原以为 traveller_3 会被设置为“”。但是当初始化对象与我从 ajax 调用加载的对象大小相同时,我的代码运行完美。那么如何将加载的对象复制到不同大小的初始化对象呢?

谢谢!

最佳答案

您可以使用 es6 Object Spread Operator .

试试这个:

bookingForm.travellerDetails = { ...bookingForm.travellerDetails, ...data.travellerDetails};

这实质上意味着:使用 bookingForm.travellerDetails 的原始属性创建一个新对象,并覆盖 bookingForm.travellerDetailsdata 之间的所有公共(public)属性。 travellerDetails 与来自后者的数据,加上来自 data.travellerDetails 的额外属性(如果有的话)。在 bookingForm 中找到但不在 data 中的所有属性将具有与在 bookingForm 中相同的值。

请注意,这只是 es6 语法,如果你使用 babel,你将需要 this插件。

关于javascript - 将加载的对象复制到 Javascript 中的另一个对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57758429/

相关文章:

javascript - 如何保护 JSON 响应?

node.js - NodeJs/Express Vue CLI3 应用程序错误无法设置未定义的属性渲染

javascript - 获取laravel api Vue js中的所有表格行

vue.js - Particles.js 到 Vue 组件

javascript - 是否可以在 Vue.js 中有条件地导入 css 文件?

javascript - 带有 ajax 调用的 asp.net Web 表单返回 ienumerable

javascript - 在 ES6 模块中定义全局变量的正确方法是什么?

javascript - 使来自 AJAX 调用的 div 自动滚动到父部分的底部

javascript - 如何获取javascript对象属性

javascript - vueJS点击事件不起作用