如何在不重叠的情况下显示多个小吃店

Question

我可以在屏幕上显示多条消息而不与零食条重叠其他消息吗？

我有一个服务来在我的应用程序中显示消息，但问题是当发生多个事件时我需要在屏幕上显示消息，该消息会被要显示的最后一条消息覆盖。

我需要一种不重叠消息并在不替换其他消息的情况下在另一个消息下方显示消息的好方法。

我希望它的工作方式与 Toast 的工作方式相同，在不重叠的情况下在另一条消息下方显示一条消息。

我在下面这样做的方式，一次只在屏幕上显示一条消息。

小吃message.service.ts：

  horizontalPosition: MatSnackBarHorizontalPosition = 'center';
  verticalPosition: MatSnackBarVerticalPosition = 'top';

  constructor(
    public snackBar: MatSnackBar){}

  showMessage(message: string) {
    this.snackBar.open(message, 'Close', {
      duration: 5000,
      horizontalPosition: this.horizontalPosition,
      verticalPosition: this.verticalPosition,
    });
  }

Answer 1

我认为 Snack Bar 只能使用一次。

检查文档：

https://material.io/components/snackbars#usage

一次只能显示一个小吃店。