如何从其他组件触发反应组件

Posted 2023-02-23

【中文标题】如何从其他组件触发反应组件

【英文标题】：how to trigger react component from other component

【发布时间】：2017-02-05 22:26:23

【问题描述】：

我想从其他组件触发反应组件。最好的方法是什么？我不想像“shouldShowMenu”那样在 redux 商店上创建新标志。我在考虑反应中的静态方法，但我不是反应专家。

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

我可以使用这样的静态方法吗？我应该使用静态方法更改组件状态吗？

【参考方案1】：

您应该继续在您的 redux 存储中创建 shouldShowMenu 标志。一旦你有组件以这种方式交互，它就是一个应用程序状态。一开始这似乎有些过分，但是一旦您开始拥有跨组件共享的值，这将为您省去很多麻烦！

【讨论】：

是的，谢谢。我应该这样走下去。你知道我们什么时候应该在 react 组件中使用静态方法吗？

【参考方案2】：

您不需要redux。您可以使用ref 来执行此操作。希望对您有所帮助！

<script src="https://unpkg.com/babel-core@5.8.38/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
  	  this.refs.hello.func()
    ,
    render: function() 
      return <Hello ref="hello"/>;
   
  )


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

</script>