动作和功能点击相同按钮

Question

我有2个按钮：

< button onClick= {() => { actions.showInfoOnHover(movie)}}> Show Info < /button>
< button onClick={this.open}> Show Info < /button>

第一个调用redux动作，第二个只是一个简单的函数：

open() {
    this.setState({ showModal: true });
  }

第一个按钮获取我的弹出窗口的信息，第二个按钮触发弹出窗口本身。 有没有简单的方法可以将它们组合在一起？

---

Udpate：我尝试将其合并为

open() {
    actions.showInfoOnHover(movie);
    this.setState({ showModal: true });
  }



 < button onClick={this.open}> Show Info  </ button> 

在这种情况下，action和Popup都不起作用：action不传递数据，Popup不显示。

Answer 1

您可能会缺少一些东西

首先 ，在调用open函数时，您需要传递movie参数，因为您需要它来获取信息，或者需要在props中使用它

其次 ，您应该从操作中返回一个承诺，以便一旦信息准备就绪就可以打开模式

您的代码必须看起来像

open() {
    this.props.actions.showInfoOnHover(this.props.movie)
        .then((res) => {
             this.setState({ showModal: true });
         })

}

< button onClick={this.open}> Show Info < /button>

PS您需要检查的另一件事是您是否已正确分派动作

看到代码后，您似乎没有要获取信息的API调用，因此您可以简单地使用

open() {
    actions.showInfoOnHover(this.props.movie)
    this.setState({ showModal: true });

}

< button onClick={this.open}> Show Info < /button>