IE11 React.memo + react-redux 连接问题

Question

我正在尝试使用 React.memo 记忆 redux 连接的组件。我的代码在主要浏览器中正常工作，但 IE 抛出错误：

You must pass a component to the function returned by connect. Instead received {"$$typeof":60115,"compare":null}

组件代码：

import React, { memo } from 'react';
import { connect } from 'react-redux';

const MyComponent = ({ some, prop }) => (
  <div>Some React</div>
);

const MyComponentMemoized = memo(MyComponent);

const mapStateToProps = state => ({
  some: someSelector(state),
  prop: propSelector(state),
});

const MyComponentMemoizedAndConnected = connect(mapStateToProps)(MyComponentMemoized);
export default MyComponentMemoizedAndConnected;

关于应用程序设置的注意事项：将 webpack 与 babel-loader 一起使用，babel 配置：

  "presets": [
    [
      "@babel/preset-env",
      {
        corejs: '3.6',
        "targets": {
          "chrome": "58",
          "ie": "11"
        },
        useBuiltIns: 'usage',
      },
    ],
    "@babel/preset-react"
  ]

Answer 1

经过几个小时的调试后，我发现这个错误在我从我的 webpack entry arr 中删除 'react-hot-loader/patch' 后消失了。不知道为什么会这样，但希望它能节省一些人的时间

Answer 2

如果有人运行遇到这个问题，请检查您使用的顺序 memo 和 connect。

例如，使用 recompose 中的 compose：

compose(
    React.memo,
    connect(mapStateToProps),
)(MyComponent);

React.memo应该在connect之前使用。

IE11 React.memo + react-redux 连接问题

IE11 React.memo + react-redux connect issue

internet-explorer-11

reactjs

babeljs

redux

react-redux