如何在用户点击注销后正确重定向

15 浏览
0 Comments

如何在用户点击注销后正确重定向

应用程序功能具有路由器，我将在组件中使用它们，感谢帮助....

function App() {
  return (
    
        
          
            
          
          
            
          
        
         }
        />
         }
        />
    
  );
}
export default App;

管理员点击注销按钮后，只需使用重定向，而不使用 useHistory。

const Admin = () => {
  const logoutfunc = async () => {
    let connectToServer = new ConnectToServer();
    //let session=await connectToServer.getSession()
    connectToServer.logout();
  };
  const redirect = () => {
    return ;
  };
  return (
      
      
      
      
  );
};
export default Admin;

0

1 答案

0 Comments

问题的原因是在用户点击登出后，需要正确地进行重定向。第一个解决方法是使用useState钩子来设置重定向状态，并在点击登出后将重定向状态设置为true。当重定向状态为true时，使用组件将页面重定向到指定路径。第二个解决方法是使用push方法来进行重定向，点击登出后直接使用history.push方法将页面重定向到指定路径。

如果使用useState方法，可以通过客户端检查来更改重定向状态。但是，这个想法是错误的，因为React是一个客户端应用程序，用户可以在客户端上更改任何React中的内容。

以下是整理的内容：

如何在用户点击登出后正确地进行重定向

第一种方法是使用useState钩子来设置重定向状态，并在点击登出后将重定向状态设置为true。当重定向状态为true时，使用组件将页面重定向到指定路径。

const Admin = () => {
  const [redirect, setRedirect] = useState(false);
  const logoutfunc = async () => {
    let connectToServer = new ConnectToServer();
    connectToServer.logout();
    setRedirect(true);
  };
  if(redirect){
    return ;
  };
  return (
    

      
    

  );
};

第二种方法是使用push方法来进行重定向。点击登出后直接使用history.push方法将页面重定向到指定路径。

const Admin = () => {
  const logoutfunc = async () => {
    let connectToServer = new ConnectToServer();
    connectToServer.logout();
    history.push({ pathname: '/' })
  };
  return (
    

      
    

  );
};

无论使用哪种方法，都需要注意React是一个客户端应用程序，用户可以在客户端上更改任何React中的内容。

0