Redux：在子組件調度Redux操作時通知父React組件

Question

我的父組件是一個React類，其中有一個執行setInterval （以及其他方法）的方法。 當滿足某些條件時，將清除此間隔。

但是，我希望當其子級中的一個子類調度特定操作時，再次在父React類上調用此方法（從而重新設置setInterval ）。

如何通知父母孩子已分派某個（Redux）動作？ 我正在使用connect傳遞狀態。 因此，父母和孩子共享相同的調度方法。

Answer 1

不知道這是否是解決您問題的最佳解決方案，但是如何將回調傳遞給子組件並從父組件分派redux操作呢？ 您也可以在那里清除間隔。

Answer 2

實際上，您可以將send操作方法從父級傳遞到子級，在此子級組件中調用此方法，例如this.props.someMethodToDispatch() ，並在分派操作之前在父級組件中對其執行某些操作。 例如：

 const dispatch = (action) => console.info("Action dispatched", action); class Parent extends React.Component { constructor(props) { super(props); this._handleChildClick = this._handleChildClick.bind(this); } _handleChildClick(action) { // You can do something here console.info("Child pass action", action); // And after that dispatch action dispatch(action); } render() { return ( <div> <h2>Simulate handle action from child</h2> <Child handleClick={this._handleChildClick} /> </div> ); } } class Child extends React.Component { _generateAction() { // This is action creator mock return {type: "SOME_ACTION", payload: "someting"}; } render() { return (<button onClick={() => this.props.handleClick(this._generateAction())}>Click me</button>); } } ReactDOM.render(<Parent />, document.getElementById("root")); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> <div id="root"></div>