我有我所有的组件包装在react redux中,我试图通过单击某个按钮来呈现来自另一个组件的某个组件,但我无法获得传递的道具
这是我试图用一些道具来渲染子组件的代码:
import React, { Component } from 'react';
import { connect } from 'react-redux';
import ChildComponent from './child_component';
class Home extends Component {
constructor(props) {
super(props);
}
go_to_child_component(){
this.setState({
child_component_triggered: true
})
}
render() {
return (
<div>
{this.state.child_component_triggered ? <ChildComponent filter="some_value" /> : null}
<button onClick={this.go_to_child_component.bind(this)}>render ChildComponent</button>
</div>
)
}
const mapStateToProps= (state) => {...//normal codes}
const mapDispatchToProps = (dispatch) => {...//normal codes}
export default connect(mapStateToProps, mapDispatchToProps)(Home);
这就是我试图通过ownProps在子组件中获取传递的props的地方:
import React, { Component } from 'react';
import { connect } from 'react-redux';
class ChildComponent extends Component {
constructor(props) {
super(props);
}
render() {
return (
<div> i am child component </div>
)
}
}
const mapStateToProps = (state, ownProps) => {
console.log(ownProps) // always {}
let obj = {...state};
obj.ownProps = {...ownProps};
return {...obj};
};
const mapDispatchToProps = (dispatch) => {...//normal codes}
export default connect(mapStateToProps, mapDispatchToProps)(ChildComponent);
ownProps始终为空对象,如有任何帮助,请
发布于 2018-05-24 18:57:29
您可以使用this.props.filter,而无需在子组件中进行映射
https://stackoverflow.com/questions/50516290
复制