2016-09-28 63 views
0

我想从其他组件触发反应组件。什么是最好的方式来做到这一点?我不想在像“shouldShowMenu”这样的redux商店上创建新的标志。我在思考静态方法的反应,但我不擅长反应。如何从其他组件触发反应组件

import Menu from './component/menu' 
const clickfeed =() => {Menu.staticClickEvent()} 
<Provider> 
    <Menu> 
    <Feed onClick={clickfeed}/> 
</Provider> 

我可以使用像这样的静态方法,我应该使用静态方法更改组件状态。

回答

1

您应该继续并在您的redux商店中创建shouldShowMenu标志。一旦你以这种方式进行组件交互,它就是一个应用程序状态。起初看起来过度,但是一旦你开始拥有一个跨组件共享的价值,这将为你节省很多麻烦!

+0

呀,谢谢你。我应该以这种方式继续前进。你知道我们何时应该在反应组件中使用静态方法吗? –

0

你不需要redux这个。您可以使用ref来执行此操作。希望能帮助到你!

<script src="https://unpkg.com/[email protected]/browser.min.js"></script> 
 
<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="container"></div> 
 
<script type="text/babel"> 
 
//component 1 
 
    var Hello = React.createClass({ 
 
    func: function() { 
 
     console.log('I\'m inside Hello component') 
 
    }, 
 
    render: function() { 
 
     return <div > Hello World< /div>; 
 
    } 
 
    }); 
 

 

 
//component 2 
 
    var Hello2 = React.createClass({ 
 
    componentDidMount(){ 
 
    //calling the func() of component 1 from component 2 using ref 
 
    \t this.refs.hello.func() 
 
    }, 
 
    render: function() { 
 
     return <Hello ref="hello"/>; 
 
    } 
 
    }) 
 

 

 
ReactDOM.render(< Hello2/> , 
 
    document.getElementById('container') 
 
); 
 

 
</script>