Question

我有一个对象数组，其格式如下：

{
    "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
    }]
}

我想做的是设置要发布的数据，如下所示：

{
    gallery: [
        {id: 606},
        {id: 610}
    ]
}

我试图做：

const imageId = this.selectedGallery.map(({id}) => id );

然后按如下所示设置图库数组：

{
  gallery: [
      {id: imageId},
  ]
}

这会将完整的数组发布到id：并失败。

我将如何处理？

Answer 1

使用这种单线时，您需要遵循特定的语法：

.map(   (   {   id   }   )   =>   (   {   id   }   )   );
 _|_   _|_ _|_  _|_         _|_  _|_ _|_  _|_
  1     2   3    4           5    6   7    8

1-您要使用的运算符

2-将用于包含参数声明的括号。如果只有一个参数，则可以忽略它。在TS中，如果您键入它，则无论如何都必须加上括号。

3-解构支架。在这些括号之间，可以有选择地选择对象中的属性。在您的情况下，您仅选择ID。

4-要选择的属性（1个或多个，用逗号分隔）

5-编写单线的粗箭头

6-评估括号：这有点棘手，Stack的答案甚至不足以解释它。最好的理解就是玩它。在这种情况下，请注意将圆括号作为返回对象的一种方式：由于函数主体（function() {}）和对象声明（obj = {}）使用相同的括号语法，因此圆括号会将其更改为返回对象而不是函数主体。

7-对象声明的括号

8-要使用的属性。编写单个属性（用{ id }代替{ id: id }）时，它只是简化了语法，但阻止了对该变量的更改。

最终的语法将是

.map(({ id }) => ({ id }))

如何从对象数组中提取键值

1 个答案: