React Router 6跳转页面数据未更新的问题及解决方法

我在编辑页面设置了返回个人资料页面的按钮，代码如下：

<Button handleClick={()=>{navigate(-1)}} >Finished</Button>
OR
<Button handleClick={()=>{navigate('/userprofile/view')}} >Finished</Button>

点击按钮后页面能正常打开，但显示的是旧数据，必须手动刷新浏览器才能加载更新后的内容。请问在 React Router 6 中，如何实现跳转后自动刷新页面，也就是重新调用对应的 loader 方法？

更新：我的浏览器路由配置如下

const router=createBrowserRouter([
  {
    path:'/',
    element: <MainHeader  />,
    errorElement:<Error/>, 
    id:'root',
    loader:tokenLoader,
    action:actionLogin(ctx),
    children:[
        {index:true, element:<Home  />, loader:()=>loaderHome(numPerPage) },
        {path:'userprofile', id:'userprofileview', loader:loaderUserProfileView,
        children:[
          {index:true, path:'view', element:<UserProfileView/>, 
            loader:checkAuthLoader, action:actionUserAccountDelete },
          {path:'edit', element:<UserProfileEdit/> }
        ] 
      },
      {path:'logout', loader:actionLogout(ctx), action:actionLogout(ctx)}
    ]
  }
])

更新：问题已解决，分享给遇到相同问题的开发者
在父路由userprofile中设置shouldRevalidate: () => true后，使用<Button handleClick={()=>{navigate('/userprofile/view')}} >Finished</Button>按钮跳转时，个人资料页面会自动获取最新数据。修改后的路由配置如下：

const router=createBrowserRouter([
  {
    path:'/',
    element: <MainHeader  />,
    errorElement:<Error/>, 
    id:'root',
    loader:tokenLoader,
    action:actionLogin(ctx),
    children:[
        {index:true, element:<Home  />, loader:()=>loaderHome(numPerPage) },
        {path:'userprofile', id:'userprofileview', loader:loaderUserProfileView, shouldRevalidate:()=>true,
        children:[
          {index:true, path:'view', element:<UserProfileView/>, 
            loader:checkAuthLoader, action:actionUserAccountDelete },
          {path:'edit', element:<UserProfileEdit/> }
        ] 
      },
      {path:'logout', loader:actionLogout(ctx), action:actionLogout(ctx)}
    ]
  }
])

内容的提问来源于stack exchange，提问作者D. Rattansingh