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

How to show several snackbar without overlapping

我可以在屏幕上显示多条消息而不与 snackBar 重叠吗?

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

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

我希望它的工作方式与 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,
    });
  }

我觉得小吃店只能用一次

查看文档:

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

Only one snackbar may be displayed at a time.