如何在将 json 发布到 React 组件状态之前对其进行处理？

Posted 2023-03-28

【中文标题】如何在将 json 发布到 React 组件状态之前对其进行处理？

【英文标题】：How to process json before issuing it to the React component state?

【发布时间】：2022-01-05 18:33:51

【问题描述】：

我编写了一个 API，它以以下格式输出 JSON：

      "status": true,
      "data": [
        
          "id": 10,
          "name": "The Land Before Time",
          "genre": "Fantasy",
          "rating": 7,
          "explicit": false
        ,
        
          "id": 11,
          "name": "Jurassic Park",
          "genre": "Science Fiction",
          "rating": 9,
          "explicit": true
        ,
        
          "id": 14,
          "name": "Ice Age 3: Dawn of the Dinosaurs",
          "genre": "Action/Romance",
          "rating": 2,
          "explicit": false
        
      ]
    

但在将 json 发布到 React 组件状态之前，我无法弄清楚如何处理它。

告诉我一些讨论或材料，文章将帮助我理解“如何正确处理来自 API 发出的 json 数据，无论使用对象和/或数组或嵌套级别。也许有一个库用于这些目的？

我会很感激你的帮助。

【参考方案1】：

如果您使用axios，它应该在请求后解析JSON，您只需将结果保存在一个变量中，您就可以从那里获取所有数据。

顺便说一句，不要忘记axios 返回一个承诺，所以使用await 或then 来处理它。

【参考方案2】：

我认为您不需要任何库。您可以使用JSON.parse()。 API 的响应将是字符串类型。所以你首先解析它，你可以得到一个 JSON 对象。您可以根据需要设置 React 状态。