按字段值宽度提取和过滤数组中的图像

时间:2018-11-16 02:47:48

标签: javascript reactjs axios gatsby

如何获取url以仅获取具有width: 2048的数组中的图像?另外,也许更简单的是我需要的每张图片都位于filename TABLET_LANDSCAPE_LARGE_16_9.jpg

的末尾

我正在createRemoteFileNode中使用gatsby-node来从外部api中以随机方式array导入图像

fileNode = await createRemoteFileNode({
  url: event.images.url,
  cache,
  store,
  createNode,
  createNodeId
});

其中event返回为

{ "events": [
   {
      "id": "177YvfG65Xi34_c",
      "images": [
         {
           "url": "///.jpg",
           "width": 305,
           "height": 203
         },
         {
           "url": "///.jpg",
           "width": 1024,
           "height": 683
         },
         {
           "url": "///.jpg",
           "width": 2048,
           "height": 1152
         }
      ]
   },
   {
      "id": "Z7r9jZ1AeC4_Y",
      "images": [
         {
           "url": "///.jpg",
           "width": 305,
           "height": 203
         },
         {
           "url": "///.jpg",
           "width": 2048,
           "height": 1152,
         },
         {
           "url": "///.jpg",
           "width": 1136,
           "height": 639,
         }
      ]
   }
]}

我只需要具有url的{​​{1}},但是width >= 1900中的url是随机的,因此array可能适用于第一个{{ 1}}数据,但不是秒。


对于那些需要更多信息的人,这里是完整的代码

event.images[2].url

1 个答案:

答案 0 :(得分:1)

如果您期望的结果是“事件”,则可以尝试...希望对您有帮助。

 const obj = {
    "events": [
      {
        "id": "177YvfG65Xi34_c",
        "images": [
          {
            "url": "///.jpg",
            "width": 305,
            "height": 203
          },
          {
            "url": "///.jpg",
            "width": 1024,
            "height": 683
          },
          {
            "url": "///.jpg",
            "width": 2048,
            "height": 1152
          }
        ]
      },
      {
        "id": "Z7r9jZ1AeC4_Y",
        "images": [
          {
            "url": "///.jpg",
            "width": 305,
            "height": 203
          },
          {
            "url": "///.jpg",
            "width": 2048,
            "height": 1152,
          },
          {
            "url": "///.jpg",
            "width": 1136,
            "height": 639,
          }
        ]
      }
    ]
  }

const events = obj.events;
let output = [];
events.forEach(elm => {
  let filterResults = elm.images.filter(e => e.width >= 1900);
  output.push([...filterResults]);
});

console.log(output);