Arrays 在React中动态筛选出JSON响应

我试图在静态数组的基础上过滤出JSON响应。 例如，如果响应类似于以下内容

{
   "Name":React, 
   "Version": 9.0, 
   "Level": Intermediate, 
   "Machine": Desktop, 
   "Release date": 2019-08-10
}

。这将存储在组件的状态中。 比如说，数组是

[ "Version", "Release date"]

这是通过道具实现的。 现在我想使用这个数组过滤json数据。所以，这意味着如果我们使用给定的示例，我应该只能显示version和release date字段！ 有办法吗？ 那么，如何正确地遍历它们中的每一个，以及具体在哪里？比如应该在componentDidMount函数中对其进行过滤，还是需要为其定义另一个函数

---

我是React和JSX的新手。

我不确定我是否完全理解您的目标，但让我们试试看

首先，您要设置响应的状态。 因此，必须在构造函数中设置状态

响应：{}

。你做到了吗？ 如果是这样，那太好了！ 现在，当您使用axios.get（）或fetch（）获得响应时，可以将响应设置为状态

axios
    .get(url)
    .then(res => { this.setState({ response: res }); }) //sets JSON object to state
    .catch(e => console.log(e)); //return a error to the console if it fails

（注意：如果使用react fetch（）函数，在使用setState之前，首先需要使用

.JSON（）；

将响应转换为JSON）

但我不明白你的问题。 是否要将ReleaseDate和Version的值附加到数组中？ 或者干脆替换它的数据

也许您希望装箱一个对象数组，其中每个对象都有一个版本和发布日期字段。或者甚至可以将整个响应附加到此数组（类似于保留以前响应的历史记录）并直接访问版本和日期字段

你能澄清一下吗

还有一个提示： 您询问是否应该在componentDidMount或其他函数中进行迭代。我建议您创建一个类似于

readResponse

的函数，并在componentDidMount（）中调用它，除非您绝对地确保不需要再次调用它。假设您将在此页面上发出多个请求，您需要多次调用它

问题编辑后：

@Varnikachaturalvedi很抱歉反应太晚。我想我理解你的问题了。 以下是我们可以做的： 让我们使用我前面提到的相同代码，但有一点不同：

axios
    .get(url)
    .then(res => { 
        this.setState({ response: res.data });
        myArray.push({ 
            "Version": res.data.get("Version"), 
            "Release date": res.data.get("Release date")
        });
    })
    .catch(e => console.log(e));


    // what is supposed to happen is add a object containing version 
    // and release date to a already defined array named myArray

---

PS：我是根据记忆输入的，所以可能有语法错误或愚蠢的事情，所以如果有错误，请阅读错误。

您好，刚刚更新了问题，现在可以看一下吗？@VarnikaChaturvedi很抱歉反应太晚。我编辑了我最初的回复，试图解决你的问题。希望能有帮助。另外，如果你的问题解决了，别忘了将问题标记为已解决。祝你好运