如何在React上显示错误消息？

Question

以下代码用作Excel文件的用户的输入接收器，如果Excel文件的格式正确，则将其带到Mainpage。我想显示错误消息（弹出甚至警报），我似乎无法弄清楚如何做。

我尝试了工具提示，但它与该问题无关，但我尝试了警报，但这不起作用，没有说出它的外观。

function App() {

  const [fileData, setFileData] = useState<any>();

  const handleFileData = (data: any) => {
    for (let index = 0; index < data[0].length; index++) {
      if (data[0][index] != null) {
        if (data[0][index].includes("name" && "id")) {
          setFileData(data);
        }
      }
    }
  }
  const isData = () => {
    if (fileData !== undefined) {
      return <MainPage Data={fileData}></MainPage>;
    }
    return HOMEPAGE

  }

  const HOMEPAGE = (
    <div className="App" style={{ "overflowX": "hidden", }}>
      <h1 style={{ "marginBottom": "50px", "marginTop": "25px" }}>NEXUM Interface</h1>
      <InputPart handleFileData={handleFileData}></InputPart>
    </div>
  );

  return (
    <BrowserRouter>
      <Routes>
        <Route path="/" element={HOMEPAGE}></Route>
        <Route path="/main" element={isData()}></Route>
      </Routes>
    </BrowserRouter>
  );
}

export default App;

：如果您对我有建议或可以格式化代码在发生错误时显示错误消息（查看ISDATA，目前我要返回主页，我想用错误消息返回主页），这将有助于很多。