動作和功能點擊相同按鈕

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>