javascript - React 如何在脚本运行完成后才构建 React 页面

Question

我有一个从 API 获取信息的脚本，但我目前面临的问题是，在该脚本完成加载之前正在加载反应页面，所以我在没有必要信息的情况下获取页面，我需要重新加载使用新信息的页面。window.location.reload(false)，不是一个选项。

标签： javascriptreactjs

Answer 1

null从渲染方法返回，直到加载脚本。

使用组件中的状态在脚本加载时再次触发渲染。

例如：

const comp = () => {
  const [apiData, setApiData] = useState(null)
  useEffect(() => {
    // API call
    setApiData(data)
  }, [])
  if (!apiData) {
    return null // or return a loader
  }

  // use apiData
  return (<div>{apiData}</div>)
}