Reactjs 当URL未更新时，在React中更改屏幕的最佳方法

我有一个我正在构建的应用程序，尽管每个屏幕占据了整个页面，但url永远不会更新

当屏幕是要查看的屏幕时，渲染每个屏幕的最佳方式是什么

export const App = () => {
  const [activeScreen, setActiveScreen] = useState("PAGE_1");
  const goToScreen2 = () => setActiveScreen("PAGE_2");
  const goToScreen3 = () => setActiveScreen("PAGE_3");

  return (
    <Wrapper>
      {activeScreen === "PAGE_1" &&
        <Page1 nextScreen={goToScreen2} />
      }

      {activeScreen === "PAGE_2" && 
        <Page2 nextScreen={goToScreen3} />
      }

      {activeScreen === "PAGE_3" &&
        <Page3 />
      }
    </Wrapper>
  );
};

export const App=（）=>{
const[activeScreen，setActiveScreen]=useState（“第1页”）；
const goToScreen2=（）=>setActiveScreen（“第2页”）；
const goToScreen3=（）=>setActiveScreen（“第3页”）；
返回(
{activeScreen==“第1页”&&
}
{activeScreen===“第2页”&&
}
{activeScreen===“第3页”&&
}
);
};

我会这样做：

函数第1页（）{
返回“第1页”
}
函数第2页（）{
返回“第2页”
}
函数第3页（）{
返回“第3页”
}
功能寻呼机({
下一个
前，
儿童
}) {
报税表（
上
{儿童}
下一个
)
}
常量页面=[Page1，Page2，Page3]
常量应用=（）=>{
const[activeScreen，setActiveScreen]=React.useState（0）；
const goNext=（）=>setActiveScreen（（activeScreen+1）%pages.length）；
const goBack=（）=>setActiveScreen（（activeScreen-1+pages.length）%pages.length）；
const ActivePage=pages[activeScreen]
报税表（
);
};
ReactDOM.render（，document.querySelector（'#root'））

页面是否将以线性顺序显示？您尝试过吗？@Treycos是的，它们将以线性顺序显示，以上面的顺序显示。@我已经在很多其他应用程序中使用过它，但不确定这是否是在url根本不更新时使用的正确解决方案。哦，我不明白这是我想要的行为