防止外部用户从浏览器标签路由到页面

在React中，可以使用react-router-dom提供的<Redirect>组件来防止外部用户从浏览器标签路由到页面。 首先，在需要进行保护的组件中，import Redirect组件： import { Redirect } from 'react-router-dom'; 然后，在组件的render函数中，加入一个判断，如果用户没有登录，则跳转到登录页面： render() { const { isLoggedIn } = this.props; if (!isLoggedIn) { return <Redirect to="/login" />; } ... } 其中，isLoggedIn表示用户是否已登录，可以在组件的props中获取。 代码示例： import React from 'react'; import { Redirect } from 'react-router-dom';

class ProtectedComponent extends React.Component { render() { const { isLoggedIn } = this.props; if (!isLoggedIn) { return <Redirect to="/login" />; }

return <div>Protected Component</div>;

} }

export default ProtectedComponent;