有没有办法在使用多个useState时简化条件渲染？

const [state, setState] = useState({
  isLoggedin: false,
  username: '',
  email: ''
});

return (
  <div>
    {state.isLoggedin ? (
      <p>Welcome, {state.username}!</p>
    ) : (
      <p>Please log in.</p>
    )}
  </div>
);

setState(prevState => ({
  ...prevState,
  isLoggedin: true,
  username: 'John',
  email: 'john@example.com'
}));