useSelector导致使用reshRqual进行重新渲染？

Question

我有一个简单的应用程序组件，如下所示

import { useSelector, shallowEqual } from 'react-redux';

const App: React.FC = () => {
  console.log('im at App')
  const currentUser = useSelector((state) => (state.userManagement.user), shallowEqual);
  // user is an object

  return (
    <div className="App">
      <header className="App-header">
        Hello World
        <nav>
          <ul>
            <li>
              <Link to="/">Home</Link>
            </li>
            <li>
              <Link to="/about">About</Link>
            </li>
            <li>
              <Link to="/users">Users</Link>
            </li>
          </ul>
        </nav>
      </header>
    </div>
  );
}

每当我按“主页” Link并导航到上面的组件时，我都会两次看到我在应用程序中吗？尽管我添加了useSelector，shallowEqual仍将导致第二次重新渲染。我是否误解了使用此shallowEqual的概念？

更新：

我已经添加了建议的useEffect进行调试，并意识到它已经被记录了一次，但是为什么im at App被打印了两次？

useEffect(() => {
    console.log("current user changed", currentUser)
  },[currentUser])

Answer 1

在strict mode中，挂钩/渲染可以多次运行。

Answer 2

将其添加为建议内容需要一些代码。

只需尝试一下即可对其进行调试。如果此日志正在发生，则意味着您的currentUser对象正在更改

exports.SessionHandler = async function (req, res, next) {
  // Session handler without arrow function 
}

注意：这只是调试建议。

Answer 3

如果您研究useSelector（https://github.com/reduxjs/react-redux/blob/master/src/hooks/useSelector.js#L9）的实现，那么您会发现useSelector不仅会检查返回值是否发生更改，还会检查是否有任何更改店内（https://github.com/reduxjs/react-redux/blob/master/src/hooks/useSelector.js#L32）。

根据设计，它将通过调度状态更新来强制进行更新（请参见forceRender：https://github.com/reduxjs/react-redux/blob/master/src/hooks/useSelector.js#L15的实现）

就我喜欢react挂钩而言，感觉好像最好使用connect(mapStateToProps)(App)方法，以避免过多的更新。

理解为什么他们以这种方式实现它会很有趣。