ReactJS中的条件功能组件渲染

Question

我有以下代码：

my code

当“ load”为true时，我想返回的内容是

        <div className="App">
          <h1>Hello CodeSandbox</h1>
          <h2>Start editing to see some magic happen!</h2>
       </div>

否则返回空对象

Answer 1

我们不能直接在JSX中渲染空对象。我们可以这样做或使用空字符串

export default function App() {
  let load = true;
  return (
    <div className="App">
      {load === true ? <h1>Loading... </h1> : <h1>no data</h1>}
    </div>
  );
}