[英]How to Extract Key Values from an Object Array
I have an array of objects which are formatted like this:我有一个对象数组,其格式如下:
{
"gallery": [{
"id": 606,
"status": 1,
"name": "00000000606.png",
"title": "splash.png",
"location": "",
"caption": "",
"type": "image/png",
"charset": "binary",
"tags": "",
"width": 2732,
"height": 2732,
"size": 476358,
"embed_id": null,
"user": 1,
"date_uploaded": "2019-09-26T05:22:31-04:00",
"storage_adapter": "local",
"url": "/storage/uploads/00000000606.png",
"thumbnail_url": "/storage/uploads/thumbs/606.png",
"old_thumbnail_url": "/storage/uploads/thumbs/00000000606-png-160-160-true.jpg",
"html": null
}, {
"id": 610,
"status": 1,
"name": "00000000610.png",
"title": "icon.png",
"location": "",
"caption": "",
"type": "image/png",
"charset": "binary",
"tags": "",
"width": 1024,
"height": 1024,
"size": 274477,
"embed_id": null,
"user": 1,
"date_uploaded": "2019-09-26T06:43:44-04:00",
"storage_adapter": "local",
"url": "/storage/uploads/00000000610.png",
"thumbnail_url": "/storage/uploads/thumbs/610.png",
"old_thumbnail_url": "/storage/uploads/thumbs/00000000610-png-160-160-true.jpg",
"html": null
}]
}
What I would like to do is set the data for posting as follows:我想做的是将发布的数据设置如下:
{
gallery: [
{id: 606},
{id: 610}
]
}
I have tried to do:我试图这样做:
const imageId = this.selectedGallery.map(({id}) => id );
then setting the gallery array like this:然后像这样设置画廊数组:
{
gallery: [
{id: imageId},
]
}
this posts the full array to id: and fails.这会将整个数组发布到 id: 并失败。
How would I approach this?我将如何处理这个?
When you use that kind of one-liner, you have a specific syntax to follow:当您使用这种单线时,您需要遵循特定的语法:
.map( ( { id } ) => ( { id } ) );
_|_ _|_ _|_ _|_ _|_ _|_ _|_ _|_
1 2 3 4 5 6 7 8
1 - the operator you are going to use 1 - 您要使用的运算符
2 - the parenthesis that will be used to contain your parameters declaration. 2 - 用于包含参数声明的括号。 You can omit it if you have a single parameter.
如果你有一个参数,你可以省略它。 In TS, if you type it, you're forced to put the parenthesis anyway.
在 TS 中,如果你键入它,无论如何你都必须加上括号。
3 - The deconstruction bracket. 3 - 解构支架。 Between those brackets, you can selectively pick properties in your object.
在这些括号之间,您可以选择性地选择 object 中的属性。 In your case, you are picking only the ID.
在您的情况下,您只选择 ID。
4 - the properties to pick (1 or more, comma separated) 4 - 要选择的属性(1 个或多个,逗号分隔)
5 - The fat arrow to write a one-liner 5 - 写单行字的粗箭头
6 - The evaluating parenthesis: this one is a bit tricky, a Stack answer wouldn't even be enough to explain it. 6 - 评估括号:这个有点棘手,堆栈答案甚至不足以解释它。 The best to understand it is to play with it.
最好的理解是玩它。 In this case, see that parenthesis as a way of returning an object: since the function body (
function() {}
) and object declaration ( obj = {}
) use the same bracketed-syntax, the parenthesis changes it to return an object instead of a function body. In this case, see that parenthesis as a way of returning an object: since the function body (
function() {}
) and object declaration ( obj = {}
) use the same bracketed-syntax, the parenthesis changes it to return an object而不是 function 主体。
7 - the bracket for the object declaration 7 - object 声明的支架
8 - the properties to use. 8 - 要使用的属性。 When writing a single property (
{ id }
instead of { id: id }
), it simply reduces the syntax but prevents from doing changes to that variable.当编写单个属性(
{ id }
而不是{ id: id }
)时,它只会减少语法,但会阻止对该变量进行更改。
The final syntax would then be最终的语法将是
.map(({ id }) => ({ id }))
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.