代码之家  ›  专栏  ›  技术社区  ›  31113

如何将道具(从Redux获得)从一个组件传递到另一个组件(React/Redux)?

  •  0
  • 31113  · 技术社区  · 6 年前

    如何将props(即从redux获得的props)从wrappercomponent传递到innercomponent(react/redux)?

    import React, { Component } from "react";
    import { connect } from "react-redux";
    import { withRouter } from "react-router-dom";
    import InnerComponent from "./InnerComponent ";
    
    class WrapperComponent extends Component {
      state = {
        data: []
      };
    
      render() {
        return (
          <div>
            <InnerComponent props={this.props} />
          </div>
        );
      }
    }
    
    const mapStateToProps = state => ({
      data: state.data
    });
    
    export default connect(mapStateToProps)(withRouter(WrapperComponent));
    

    呈现包装组件后-道具仍不在。 任何Lifecicle方法都无法帮助解决它。

    有可能吗?

    1 回复  |  直到 6 年前
        1
  •  1
  •   Psartek    6 年前

    这是可能的,建议这样做,所以您不需要每次通过“连接”调用所有的hoc存储。将所有相关动作和减速器传到容器中,并作为道具传递。

    在这种情况下,您的reducer名称称为data,您需要这样调用它(我将props名称改为data,这样您就可以将props.data调用给您的孩子):

    <InnerComponent data={this.props.data} />
    

    或者你可以像这样传递父母的所有道具:

    <InnerComponent {...this.props} />