Toast 消息中的按钮处理程序未触发 Ionic 4，为什么？

Question

我正在尝试使用 Ionic 离子吐司。我在他们的网站上找到了这个例子：https://ionicframework.com/docs/api/toast

现在我的问题是： "handler" 不会调用上面添加的任何按钮的回调，也不会显示任何日志。我在 Android 设备和浏览器 Safari MacOS 上尝试了这段代码，但两者都显示了同样的问题。

我试过用 toast.onDidDismiss().then(()=>{ console.log('Closed'); }) 但这无济于事，因为我打算添加多个按钮，而且我想区分单击了哪个按钮。

我知道我可以构建自己的组件来执行此操作，但我想知道我的代码中是否缺少某些内容，或者这是 ion-toast 的一个众所周知的问题。

代码：

  async presentToastWithOptions() {    
    const toast = await this.toastController.create({
      header: 'Toast header',
      message: 'Click to Close',
      position: 'top',
      buttons: [
        {
          side: 'start',
          icon: 'star',
          text: 'Favorite',
          handler: () => {
            console.log('this log should appear when this icon is clicked.');
          }
        }, {
          text: 'Done',
          role: 'cancel',
          handler: () => {
            console.log('This log should appear when I click done.');
          }
        }
      ]
    });
    await toast.present();
  }

所以我期望的是：当我单击按钮 'Done' 或图标 'star'（这是添加到 toast 的 2 个按钮）时，我应该在我的控制台中看到相应的 console.log 但实际上我在控制台中什么也得不到.

我也尝试添加断点，但从未调用过这两个 "handler" 回调。

控制台中没有错误消息...甚至没有相关警告。

这正常吗？还是我遗漏了什么？

Answer 1

您只需从“完成”按钮对象中删除 role: 'cancel'，它们就会按预期开始工作。

Toast 消息中的按钮处理程序未触发 Ionic 4，为什么？

button handler in Toast message Ionic 4 is not fired, why?

toast

ionic-framework

ionic4