Reactjs 分页单击后，url的编号会更改，但下一页不会加载

您好，如果我手动更改URL示例/diet/1、2或3，则我的分页工作正常。我已经实现了一个函数来添加第+1页，然后单击URL上的数字正在更改，但是页面没有加载下一个内容？我的代码如下：任何形式的帮助都将不胜感激。谢谢

const Survey = props => {

const history = useHistory()
const [selected, setSelected] = useState({})
const { count, setCount, percentage, setPercentage } = useContext(AppContext)
const pageId = parseInt(props.pageId)
const [page, setPage] = useState(pageId)
const [results, setResults] = useState([])
const [totalPages, setTotalPages] = useState(5)

useEffect(() => {
    surveyApi()
    return () => {}
}, [])

const surveyApi = async () => {
    const response = await fetch(`/api/surveyoptions?page=${page}`)
    const results = await response.json()
    setResults(results.result)
    setPage(page)
    setTotalPages(page)
}

const getPageLink = ( pageNo ) => {
    return `/diet/${ pageNo }`
}


return (
    <>

 <Link 
    to={getPageLink(page + 1)}
    onClick={ () => setPage(page + 1) }
    className="next">
    Click Link 
 </Link> 
      </>
    )
  }

  export default Survey

const Survey=props=>{
const history=useHistory（）
const[selected，setSelected]=useState（{}）
const{count，setCount，percentage，setPercentage}=useContext（AppContext）
const pageId=parseInt（props.pageId）
const[page，setPage]=useState（pageId）
const[results，setResults]=useState（[]）
常量[totalPages，setTotalPages]=useState（5）
useffect（（）=>{
surveyApi（）
return（）=>{}
}, [])
const surveyApi=async（）=>{
const response=wait fetch（`/api/surveyoptions？page=${page}`）
const results=await response.json（）
setResults（results.result）
设置页面（第页）
setTotalPages（第页）
}
const getPageLink=（页码）=>{
返回`/diet/${pageNo}`
}
返回(
设置页面（第+1页）}
className=“下一步”>
点击链接
)
}
导出默认调查

const Survey=props=>{
const history=useHistory（）
const[selected，setSelected]=useState（{}）
const{count，setCount，percentage，setPercentage}=useContext（AppContext）
const pageId=parseInt（props.pageId）
const[page，setPage]=useState（pageId）
const[results，setResults]=useState（[]）
常量[totalPages，setTotalPages]=useState（5）
useffect（（）=>{
surveyApi（）
}，[第页]//{
const response=wait fetch（`/api/surveyoptions？page=${page}`）
const results=await response.json（）
setResults（results.result）
设置页面（第页）
setTotalPages（第页）
}
const getPageLink=（页码）=>{
返回`/diet/${pageNo}`
}
返回(
设置页面（第+1页）}
className=“下一步”>
点击链接
)
}
导出默认调查

Brooo谢谢，我花了很长时间才弄明白！我决定得到额外的帮助哈哈，非常感谢！！