Die Route kann dem Popup-Dialogfeld in vue.js nicht zugewiesen werden

Question

Ich versuche, einem benutzerdefinierten Popup, das ich mit der Dialogkomponente in vue.js erstellt habe, eine Route zuzuweisen, habe aber Probleme damit, es zum Laufen zu bringen. Ich habe viel vermasselt und bin ehrlich gesagt verwirrt, wie ich das hinbekomme. Das ist meine Routendatei:

routes: [
    {
      Pfad: "/",
      Name: „Landung“,
      Komponente: LandingView,
      Kinder: [
        {
          Pfad: "/register",
          Komponente: Registrierungsformular,
        },
      ],
    },

Ich habe eine Anmeldeseite und verwende innerhalb dieser Anmeldeseite die RegistrationForm-Komponente, die in einer benutzerdefinierten Dialogkomponente enthalten ist, die ich wie folgt erstellt habe:

<teleport to="body">
      <dialog-modal v-if="isOpenRegister" @close="isOpenRegister = false">
        <Anmeldeformular
          @open-login="(isOpenRegister = false), (isOpenLogin = true)"
          @close-dialog="isOpenRegister = false"
        />
      </dialog-modal>
    </teleport>

Ich möchte dem Popup nur dann eine Route zuweisen, wenn der Benutzer darauf klickt. Wenn der Benutzer also auf die Schaltfläche „Registrieren“ klickt und das Popup aktiviert wird, möchte ich, dass es http://localhost:5173/register lautet, anstatt jetzt keine Route zu haben, da es nur http://localhost:5173 ist. Es tut mir leid, wenn dies eine verwirrende Frage ist. Versuchen Sie bitte, sie so gut wie möglich zu erklären. Vielen Dank im Voraus!

Answer 1

您应该在某些方法内处理重定向，例如：

<teleport to="body">
  <dialog-modal v-if="isOpenRegister" @close="isOpenRegister = false">
    <RegistrationForm
      @open-login="openRegister"
      @close-dialog="isOpenRegister = false"
    />
  </dialog-modal>
</teleport>

<script>
 methods: {
   openRegister() {
     this.$router.push({ path: '/register' })
     // other method logic
   }
 }
</script>