javascript - 在 React 中从数据库加载的动态接口(interface)的最佳方式

Question

我需要重写一个 webapp，我想用 React 来做。

它目前的工作方式是在数据库中每个“页面”都有一行，可能类似于

{
  row: 1,
  column: 2,
  width: 2,
  height: 1,
  data: 'Why hello there',
  componentType: 'Box'
}

所以，我这里有两个问题:

一:我想动态加载一个我在运行时不知道的 React 组件(“Box”)。

二: 这里有一些明显的组件/布局切换方式吗？我知道 react-routes，但我看到的所有教程都表明它更“静态”(在应用程序启动之前你基本上已经知道所有的 View 和路线，而且它似乎真的不可能从数据库中获取数据)

Answer 1

这里的想法是呈现一个本质上是“空白”的应用程序版本。无论是通过启动画面还是加载微调器，或者两者的某种组合，还是其他方式。

然后在应用程序安装后，在您的 componentDidMount 方法中，您向服务器上运行的 API 发出 http 请求，该 API 从数据库中获取数据并以您的网络应用程序理解的格式返回您的数据(可能是 JSON)。然后用返回的数据填充您的应用，完成后关闭所有加载屏幕或微调器。

查看 this example from the React docs .