React使用仪表板构建CMS如何显示隐藏仪表板组件

Question

我用main（App.js）组件构建了一个具有几个组件的react app（简单CMS），大多数组件可供访问者使用。  我使用反应路由器显示组件，  我通过example.com/dashboard使仪表板组件仅对管理员可用。  我使用node.js和JWT构建了一个登录系统，我做了所有逻辑。  但我不知道隐藏仪表板组件的正确方法。  我试图用 但我无法理解其逻辑，请告诉我什么是最好的策略，以显示在React应用中隐藏仪表板。 如果其他逻辑显示/隐藏仪表板，是否可以安全使用？还是使用它不安全？ 我的问题：有没有反应的方法来完成这项工作？

示例：

list

Answer 1

您需要跟踪您的用户是否通过某种全局状态或localStorage登录。然后您可以执行以下操作：

<Route render={(props) => (
    state.isAuthenticated === true
        ? <Component {...props} />
        : <Redirect to='/login' />
)} />

请记住，恶意使用可能会打开devtools并将isAuthenticated更改为true，因此您在仪表板上提供的任何内容也都需要通过身份验证来保护。