javascript - 修改 localStorage 时，mapStateToProps 不更新 props

Question

我有一个需要身份验证的 redux 应用程序。现在，我正在尝试确保应用程序确保用户在应用程序中执行应用程序时仍然处于登录状态。这是我的 App.jsx 文件的底部:

function mapStateToProps({ offline, user }) {
    return {
        // we use this to know if we should redirect to auth pages
        // we don't want logged in users to be hitting these static pages
        loggedIn: !!user.token,
        offline,
    };
}

const ConnectedApp = connect(mapStateToProps)(App);

export default ConnectedApp;

我通过 Chrome 开发者工具清除站点本地存储来测试此功能。然后在网站上执行操作。我放置了许多不同的日志语句。我发现 mapStateToProps 正在被调用，但 props 没有改变。应用程序继续认为用户仍处于登录状态并且状态未更改。

我一直在关注我能找到的所有在线资源，但似乎没有任何帮助。我错过了什么吗？

Answer 1

那是因为mapState仅当操作被分派(dispatch)到 Redux 存储时才重新运行，并且计算出新的存储状态作为结果。修改本地存储不涉及调度 Redux 操作，因此您的 mapState永远不会运行。

不要依赖 localStorage 中的值在 mapState函数 - 他们应该仅从 state 中提取值参数，并返回它们。