Dialogues that pop up over and over

Even if I destroy the dialog after closing it, next time I press the Delete button, another one is created.

$f7.dialog
  .create({
    title: translate("DeleteAccount"),
    text: translate("DeleteAccountInfo"),
    on: {
      dialogClosed: function (dialog) {
        console.log("closed");
        dialog.destroy();
      },
      dialogBeforeDestroy() {
        console.log("destroy");
      },
    },
    buttons: [
      { text: "Cancel" },
      {
        text: "Delete",
        color: "red",
        onClick() {
          deleteMe()
            .then((res) => {
              if (!res.status) {
                app.ShowPopup(res.message, "Short,Bottom");
                return;
              }
              onMenuSelect(0);
            })
            .catch(onFetchError);
        }
      }
    ]
  })
  .open(true);

No problem on first boot. Then when I go back to the beginning with the navigate, I press the Delete key and the dialog appears again.

If I reload the page with navigate 3 times. Every time I press the Delete button, a dialog pops up again.

Since I opened the page 3 times, it repeated the dialogue 3 times. If I logged in again it would repeat 4 times this time.

My mistake, every time the Page is $onMounted I do this:

$(".list-menu > ul > li").on("click", function (el) {
    onMenuSelect($(this).index());
});

It adds one more listener every time the page runs, and they don’t close automatically when the page is removed.

If I close it before the page is removed, the problem is solved.

$on("pageBeforeRemove", (e, page) => {
    $(".list-menu > ul > li").off("click");
});