从子组件中更新父组件

我无法从子组件中重新提交父组件 - 我将componentDidMount作为道具传递给子类，然后在那里调用它，并期望父级重新提交。渲染函数被调用，但内容保持不变。怎么了？从子组件中更新父组件

var Parent = React.createClass({ 
    getInitialState: function() { return {content: 'clean'}; }, 
    componentDidMount: function() { 
     this.setState({content: 'changed!'}); 
    }, 
    render: function() { 
     return React.createElement('div', {rerender: this.componentDidMount.bind(this)}, this.state.content); 
    } 
}); 

var Child = React.createClass({ 
    render: function() { 
     return React.createElement('div', {onClick: this.handleClick}, 'click me'); 
    }, 
    handleClick: function() { 
     this.props.rerender(); 
    } 
}); 

ReactDOM.render(
     React.createElement(ReactRouter.Router, {history: ReactRouter.browserHistory}, 
       React.createElement(ReactRouter.Route, {path: '/parent', component: Parent}) 
     ) 
, document.getElementById('content'));

来源

2016-08-22 user99999

发送一个类方法作为道具回调到子组件，该回调需要在父组件中设置'setState' –

但是，这是exacly我在我的例子 – user99999

做的事情不要使用'this.componentDidMount'作为事件回调:)你应该创建自己的函数来处理在父组件中的'rerender .. ..当然，它不会有机会，因为当父组件挂载状态将是'content：changed！'，当你处理点击它会调用相同的功能，所以状态将是相同的。 – Hardy

componentDidMount()是组件完成渲染时调用的生命周期函数。

调用它看起来像是在规避整个重新渲染过程。

您应该改为创建自己的功能。

changeContent: function() { 
     this.setState({content: 'changed!'}); 
    },

再经过changeContent()到rerender。

通常，避免传递React的LifeCycle方法！

来源

2016-08-22 22:40:45 Cent

为了解决所有这些问题，Facebook上的家伙提出了单向数据流模式。你的孩子组件不应该知道父母，而应该改变某种状态（Flux，Redux，Reflux）。对状态的更改将触发父组件的重新渲染。

来源

2016-08-22 22:59:22

从子组件中更新父组件

回答

相关问题