Question

我使用React开发Web应用程序。

要求：我的要求是，我有一个函数组件，该函数组件将满足我的mapStateToProps函数，并从类组件中调用该函数组件。这样我的代码重复次数将减少。

问题：现在的问题是，当我在函数组件中编写mapStateToProps，然后从类组件中调用它时，就不会执行

class: A.js
import React, { Component } from 'react'
import b from './B'

export class A extends Component {

    submit = () => {
        b();
    } 
    render() {
        return (
            <div>
                <Button onClick={this.submit}>Submit</Button>
            </div>
        )
    }
}

export default A



functional Component: B.js
import { connect } from "react-redux";

const b = () => {
    let data = {
        name = props.details.name
    }
    return data;
}

const mapStateToProps = (state) => {
    return {
        name: state.detailReducer.name
    }
}
export default connect(mapStateToProps)(b);

帮助：那么任何人都可以帮助我如何实现这一要求。这将非常有帮助。另外请告诉我，这是从其他函数组件中调用mapStateToProps的好方法。

Answer 1

您必须区分功能和功能组件。在Component A中，您将b用作函数，尽管应该是一个函数组件。那你做不到。功能组件是指渲染而不是执行。

也为了使b成为实际的函数组件，b在参数列表中缺少props，它应为props.name而不是props.details.name，并且需要返回{ {1}}。最后应该叫JSX。

如何从函数到类组件获取mapStateToProps值

1 个答案: