【问题标题】:React / Redux Topic: Conditional Rendering based on Store StateReact / Redux 主题:基于 Store State 的条件渲染
【发布时间】:2021-08-16 01:16:15
【问题描述】:

前言:

  • 这是我项目中的一种身份验证机制。
  • 我正在重构从使用 Contexts 到 Redux 来控制状态

Redux 存储将“isLogged”作为布尔值作为状态的一部分。成功登录后(用户使用正确的电子邮件和密码提交表单),axios 响应会验证用户,并且客户端会发送状态更改的操作。根据我使用 redux 开发工具扩展所看到的情况,状态更改成功发生

问题:

我有一个导航栏组件,它根据 isLogged 状态有条件地呈现链接公共和私有组件。它只是在商店状态更新时不会重新呈现,因此当前用户无法看到更新后的导航栏,即使状态发生了应有的变化。

提前感谢您的帮助。

【问题讨论】:

  • 提供一些代码,以便有人可以调试它并找出问题所在。
  • 您可能需要将 Navbar 组件连接到 redux,您能否分享初始状态和 Navbar 代码

标签: reactjs redux state conditional-rendering


【解决方案1】:

我刚刚解决了这个问题。

我必须通过“react-redux”中的 useSelector 钩子访问商店状态。似乎当我尝试使用 store.getState() 方法获取状态并将其存储在变量中并通过 props 传递时,函数组件没有监听更新。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-12-09
    • 1970-01-01
    • 2019-07-11
    • 2016-10-29
    • 2017-06-17
    • 2018-05-30
    相关资源
    最近更新 更多