我有一个component看起来像这样
component
class Test extends React.Component { onClick() { alert("I am a Component") } render() { const { fromContainer } = this.props return ( <a href="#" onClick={ this.onClick }>Test Link</a> ); } }
在我container我连接Test到Store。我需要在上调用两个函数onClick。component本身定义的一个函数(onClick()与一起alert(),另一个函数fromContainer是action,正在通过reducer等)。
container
Test
Store
onClick
onClick()
alert()
fromContainer
action
reducer
如何使fromContainer组件知道该功能。当仅调用一个函数时:
class Test extends React.Component { render() { const { fromContainer } = this.props return ( <a href="#" onClick={ fromContainer }>Test Link</a> ); } }
就是这样。但是它不适用于在不同“位置”中定义的两个功能。
class Test extends React.Component { constructor() { super() this.test = this.test.bind(this) } test() { this.props.fromContainer(); //call other function here } render() { const { fromContainer } = this.props return ( <a href = "#" onClick = { this.test }> Test Link </a> ); } }
请尝试这个