Redux `connect()` 返回一个对象 [英] Redux `connect()` return an object

问题描述

我正在使用这些库:

反应:16.8.6还原:4.0.1反应还原:7.0.3

我有一个简单的组件(Typescript):

import ...;从'react-redux'导入{连接}；class ExampleComponent 扩展了 React.PureComponent{构造函数(道具:任何){超级(道具)；}公共渲染(){返回 (<div>{this.props.name}

);}}接口 IProps{名称:字符串；}const mapStateToProps = (状态) =>{返回 {名称:state.name};}导出默认连接(mapStateToProps)(示例组件)；

而且我有一个父组件:

import ExampleComponent from './ExampleComponent';导出默认类 App 扩展 React.PureComponent<{}, {}>{构造函数(道具:任何){超级(道具)；}公共渲染(){返回 (<div><示例组件/>

);}}

出于某种原因，connect(mapStateToProps)(ExampleComponent) 返回一个对象而不是 React 组件.我收到一个错误:

<块引用>

未捕获的错误:不变违规:元素类型无效:预期一个字符串(用于内置组件)或一个类/函数，但得到:object

此外，当我尝试执行 console.info(typeof connect(mapStateToProps)(ExampleComponent)) 时，它只会将 object 打印到控制台.

我该如何解决这个问题?

解决方案

我发现了问题.它是 react-dom 库.它被错误地设置为 16.4.XX 而 redux-dom connect 使用 React.memo() 方法可以返回一个对象.但是react-dom 16.4.XX 不知道如何处理这样的对象.

升级到 react-dom 16.8.XX 解决了这个问题.

I'm using these libraries:

react: 16.8.6
redux: 4.0.1
react-redux: 7.0.3

I have a simple component (Typescript):

import ...;  
import { connect } from 'react-redux';

class ExampleComponent extends React.PureComponent<IProps, {}> {
    constructor(props: any) {
        super(props);
    }

    public render() {
        return (
            <div>
                {this.props.name}
            </div>
        );
    }
}

interface IProps{
    name: string;
}

const mapStateToProps = (state) => {
    return {
        name: state.name
    };
}

export default connect(mapStateToProps)(ExampleComponent);

And I have a parent component:

import ExampleComponent from './ExampleComponent';

export default class App extends React.PureComponent<{}, {}> {
    constructor(props: any) {
        super(props);
    }

    public render() {
        return (
            <div>
                <ExampleComponent />
            </div>
        );
    }
}

For some reason the connect(mapStateToProps)(ExampleComponent) returns an object instead of React component. I am getting an error:

Uncaught Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function but got: object

Also when I trying to do console.info(typeof connect(mapStateToProps)(ExampleComponent)) it prints just object to the console.

How can I solve this issue?

解决方案

I've found the problem. It was the react-dom library. It was mistakenly set to 16.4.XX while redux-dom connect uses React.memo() method that could return an object. But react-dom 16.4.XX doesn't know how to handle such objects.

Upgrading to react-dom 16.8.XX solved the problem.

这篇关于Redux `connect()` 返回一个对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！