React Material UI 在等待数据时在表中显示进度

Question

我知道可以在尚未填充的表格上显示循环进度。你怎么做呢？

就目前情况而言，该表显示“没有可显示的记录...”，直到服务器返回数据。

========= 进一步@torquan 的回复，这对我来说更详细。

const [dataFetched, setDataFetched] = useState(false)

转换EmployeesTable成一个组件 - 然后我必须传递道具，它工作得很好。

         {!dataFetched ? (
            <CircularProgress />
         ) : (
            <EmployeesTable
               data={employees}
               token={token}
            />
         )}

Answer 1

您可以显示一个微调器，直到获取数据为止。

该部分可能如下所示：

<table>
  {!dataFetched ? <Spinner /> : <YourTableBody>}
</table>

<Spinner />例如，您可以使用npm 上的某个库中的某个库，也可以编写自己的库。

您可以将 dataFetched 初始化为 false，并在 API 调用完成后将其设置为 true。如果这太笼统，您应该发布该表的代码。