Question

我需要以有序的顺序并通过读取来加载三个不同的json文件（原因是我正在使用nextjs导出，并且我需要动态读取这些文件，因此我在需要时获取它们，并且它们的内容可以更改甚至在导出之后）

第一个文件包含用于创建第二个文件的url的数据，依此类推，因此每次获取都需要获取实际更新状态，

我正在使用的解决方案ATM，因为第二个和第三个文件分别依赖于第一个和第二个文件，所以它正在获取第一个文件并使用setState设置某些状态，然后在setState回调中获取第二个文件并设置一些状态其他状态，等等：

PurchaseToken

现在：我知道setState必须是异步的，因此必须谨慎使用，但据我所知，状态更新后将调用回调函数，因此从该角度来看，状态应正确更新。此解决方案是反模式，不当做法还是出于某种原因应避免使用？

该代码实际上有效，但是我不确定这是否是这样做的方法。

Answer 1

您不需要使用setState回调并从状态中读取它，因为您可以直接从res对象中读取数据。这样，您就可以建立一个简单的承诺链。

示例

fetch(baseUrl)
  .then(response => response.json())
  .then(res => {
    this.setState({
      // ...
    });

    return fetch(anotherUrl + dataFromRes);
  })
  .then(response => response.json())
  .then(res => {
    this.setState({
      // ...
    });

    return fetch(anotherUrl + dataFromRes);
  })
  .then(response => response.json())
  .then(res => {
    this.setState({
      // ...
    });
  })
  .catch(error => {
    this.setState({
      market: defaultMarket,
      language: defaultLanguage,
      questions: defaultQuestions
    });
  });

链式React setState回调

1 个答案: