如何在React中有条件地呈现初始加载的不同组件？

import React from 'react';

function App() {
  const isLoggedIn = true; // 假设用户已登录

  if (isLoggedIn) {
    return <WelcomeUser />;
  } else {
    return <Login />;
  }
}

function WelcomeUser() {
  return <h1>Welcome, User!</h1>;
}

function Login() {
  return <h1>Please log in.</h1>;
}

export default App;

import React from 'react';

function App() {
  const isLoggedIn = true; // 假设用户已登录

  return (
    <div>
      {isLoggedIn ? <WelcomeUser /> : <Login />}
    </div>
  );
}

function WelcomeUser() {
  return <h1>Welcome, User!</h1>;
}

function Login() {
  return <h1>Please log in.</h1>;
}

export default App;