React Native API FETCH 每个对象的不同名称答案

【问题标题】：React Native API FETCH Different names for each objectsReact Native API FETCH 每个对象的不同名称
【发布时间】：2021-12-15 02:07:54
【问题描述】：

我正在连接来自React Native 应用程序的REST api。我有不同名称的文件名对象的 Json 响应，但所有对象都有相同的变量：文件名、消息和显示。

对象的数量随着对 API (REST) 的每个请求而变化，响应的对象名称因请求而异。但是每个对象中的变量都和上面一样。

我需要从这个响应中得到的信息只是文件名文本，但如果我得到对象列表这样我就可以阅读来自错误的消息，这是可以接受的。

The image shows how my objects look like.

这是我的获取请求：

     const getGists = async () => {
    await axios
      .get(`https://api.github.com/gists/public?per_page=30`)
      .then((r) => {
        let n;
        for (n = 0; n < 30; n++) {
          console.log(r.data[n].files.filename);
          // console.log("____________________");
          // console.log(r.data[n].owner.avatar_url);
          // console.log("____________________");
          // console.log(JSON.stringify(r.data[n].files));
        }
      })
      .catch((e) => {
        console.log("ERROR", e);
      });
  };

即使对象名称在每次迭代中都不相同，如何从这些请求中获取每个文件名。感谢您的帮助

【问题讨论】：

object 数据很重要，因此请尝试删除图像但编辑问题并添加有效对象，采用 JSON 或不寻常的对象格式，您当前的数据看起来不像是适合的对象操纵。
对不起，我不明白你想说什么……这个对象是从 github gists 获取的。它看起来像正确的对象，但问题是即使我不知道周围对象的名称，我如何才能获得该文件名
你为什么要访问你的 rest API 30 次？
错误地，我将在 api 中移动 FOR，并且只是从 0-30 读取.. 我只是无法获取该对象文件名，
尝试使用JS对象函数。yourObject[Object.keys(yourObject)[0]].filename

标签： javascript react-native api

【解决方案1】：

使用 API 调用的结果和一些高阶函数，这将正常工作：

  const getGists = async () => {
    await axios
      .get(`https://api.github.com/gists/public?per_page=30`)
      .then((response) => {
        const myDesireResult = response.data.reduce((acc, item) => {
          const files = Object.values(item.files);

          if (files.length > 1) {
            files.forEach((file) => acc.push(file.filename));
          } else {
            acc.push(files[0].filename);
          }
          return acc;
        }, []);

        console.log(myDesireResult);
      })
      .catch((e) => {
        console.log("ERROR", e);
  });
  };

解释：

在then块中，可以用result.data获取API调用结果

使用reduce 函数，将开始循环数据。

由于文件中的对象名称不同，我们可以很容易地得到Object.values()的文件。

有些文件包含多个项目，而大多数文件只有一个项目。因此，通过检查file 的长度，我们可以采取适当的措施。如果文件有多个元素，使用另一个简单的 lop，我们可以轻松遍历这个文件数组。

查看codesandbox上的工作示例

【讨论】：