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

Question

如何将道具(从Redux获得的(从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));

渲染WrapperComponent后，道具仍然不在。任何LifeCicle方法都无法解决这个问题。

有可能吗？

Answer 1

这是可能的，建议您这样做，这样您就不需要每次都通过"connect"调用所有HOC存储。将所有相关动作和减速器调用到容器中，并将其作为道具传递。

在这种情况下，你的reducer名称被称为data，你需要这样调用它(我把props名称改为data，所以你可以给你的孩子调用props.data(：

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

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

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