【问题标题】: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>

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

【问题讨论】:

    标签: reactjs components redux react-redux


    【解决方案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>

    【讨论】:

      猜你喜欢
      • 2019-07-20
      • 2019-12-22
      • 2022-07-21
      • 2023-03-17
      • 2018-04-26
      • 1970-01-01
      • 1970-01-01
      • 2019-05-04
      • 2019-08-04
      相关资源
      最近更新 更多