状态而不是 isLoading 布尔值？

当我看到Kent C. Dodds 写的文章《别再用 isLoading 布尔值了》isLoading时，我的第一个念头是——布尔值有什么问题？为什么我不应该用它？然后我读了这篇文章，明白了他的意思。

isLoading在应用中的数据加载时，使用布尔值来显示一些占位符或微调框是一种常见的做法。这样做没问题——你可以设置isLoading为false，然后将其更改为true数据加载时，再将数据加载完成时的状态改为false。但是，如果发生错误会发生什么？数据未加载，但也没有可显示的数据。我们开始添加更多条件——首先是未加载且无错误，然后是未加载但有错误，最后是加载中。你明白了吗？

Kent 在他的方法中建议，为每种情况设置不同的枚举值，例如'idle'、'resolved'、'rejected'。在代码中我们可以像这样（基于我之前提到的文章的示例）：

if (status === 'idle') {
    return <div>Data is loading...</div>
}

if (status === 'resolved') {
    return <div>{Fetched data}</div>
}

if (status === 'rejected') {
    return <div>Something went wrong!</div>
}

由于这一点，我们可以在每次活动后为特定情况设置状态，而不需要双重条件（例如未加载且没有错误等）。

为了摆脱等号，我们可以将状态信息放入变量中。

const isLoading = status === 'idle';

if (isLoading) {
    return <div>Data is loading...</div>
}

就是这样！我建议阅读Kent 的文章，以获得更深入的解释和更多示例。