我正在使用圖像搜索和顯示應用程序。用戶可以點擊一張照片，然后會彈出一個模式。這些模式將id在 url 中。但是，當我刷新頁面時，模態(tài)不存在并顯示錯誤。我從 unsplash api 獲取 url，因此隨著頁面刷新重新加載，url 消失了。如何將 url 保留在 url 查詢中，以便 url 即使在頁面刷新時仍然存在？列表項import React, { useState } from "react";import { Link, BrowserRouter as Router, Route } from "react-router-dom";import ModalWrapper from "./ModalWrapper";const ListItem = ({ photo }) => {  return (    <>      <Router>        <div key={photo.id} className="grid__item card">          <div className="card__body">            <Link to={{ pathname: `/${photo.id}`, state: photo }}>              <img src={photo.urls.small} alt="" />            </Link>            <Route path="/:photoId" component={ModalWrapper} />          </div>        </div>      </Router>    </>  );};export default ListItem;模態(tài)包裝器import React from "react";import Modal from "react-modal";import { useHistory, useLocation } from "react-router-dom";const customStyles = {  content: {    top: "50%",    left: "50%",    right: "auto",    bottom: "auto",    marginRight: "-50%",    transform: "translate(-50%, -50%)"  }};Modal.setAppElement("#root");function ModalWrapper() {  const history = useHistory();  const location = useLocation();  const photo = location.state;  function downloadImage() {}  function close() {    history.push("/");  }  return (    <Modal isOpen={true} onRequestClose={close} style={customStyles}>      <img src={photo.urls.small} alt="" />      <div>        <button onClick={close} className="button">          Close        </button>        <button onClick={downloadImage()}>Download</button>      </div>    </Modal>  );}export default ModalWrapper;