it-swarm.com.de

Vue.js Umleitung zu einer anderen Seite

Ich möchte eine Umleitung in Vue.js durchführen, die dem Vanilla-Javascript ähnelt

window.location.href = 'some_url'

Wie kann ich das in Vue.js erreichen?

54

Wenn Sie vue-router verwenden, sollten Sie router.go(path) verwenden, um zu einer bestimmten Route zu navigieren. Auf den Router kann von einer Komponente aus mit this.$router zugegriffen werden.

Andernfalls funktioniert window.location.href = 'some url'; für Apps, die keine Einzelseiten sind.

EDIT: router.go() wurde in VueJS 2.0 geändert. Sie können jetzt router.Push({ name: "yourroutename"}) oder nur router.Push("yourroutename") verwenden, um umzuleiten. 

https://router.vuejs.org/guide/essentials/named-routes.html

95
Jeff

Laut den Dokumenten scheint router.Push die bevorzugte Methode zu sein: 

Um zu einer anderen URL zu navigieren, verwenden Sie router.Push. Diese Methode drückt eine Neuer Eintrag in den Verlaufsstapel, wenn der Benutzer auf den Browser klickt. Zurück-Taste werden sie zur vorherigen URL gebracht.

quelle: https://router.vuejs.org/de/essentials/navigation.html

Zu Ihrer Information: Webpack & Komponenten-Setup, Single-Page-App (wo Sie den Router über Main.js importieren). Ich musste die Router-Funktionen aufrufen, indem Sie sagten:

this.$router

Beispiel: Wenn Sie eine Route namens "Home" umleiten möchten, nachdem eine Bedingung erfüllt ist:

this.$router.Push('Home') 
47
Dave Sottimano

benutz einfach: 

window.location.href = "http://siwei.me"

Verwenden Sie keinen vue-router, andernfalls werden Sie zu .__ weitergeleitet. " http://yoursite.com/#!/http://siwei.me "

meine Umgebung: Knoten 6.2.1, Version 1.0.21, Ubuntu.

21

Innerhalb eines Komponentenskript-Tags können Sie den Router verwenden und so etwas tun

this.$router.Push('/url-path')
8
Njeru Cyrus
window.location = url;

"URL" ist die Web-URL, die Sie umleiten möchten.

3
Rayees Pk

kann das auch versuchen ... 

router.Push({ name: 'myRoute' })
2

nehmen wir an, wir aktualisieren den Status der Bestellungen, klicken auf Bearbeiten und aktualisieren den Status. Jetzt möchten wir zur vorherigen Seite zurückkehren, von der wir gekommen sind. 

this.$router.Push('../index')

hier bedeutet der Teil ../index, dass Sie zweimal von der aktuellen Route zurückkehren und dann index der Name der Ansicht ist, zu der Sie gehen möchten.

im Allgemeinen seine this.$router.Push('your_path')

2
Hefaz

Nur ein einfaches einfaches Routing:  

this.$router.Push('Home');
2
KouchakYazdi

Sie können auch die V-Bindung direkt an die Vorlage wie ...

<a :href="'/path-to-route/' + IdVariable">

der : ist die Abkürzung für v-bind.

1
mEnE

Wenn jemand eine dauerhafte Weiterleitung von einer Seite /a zu einer anderen Seite /b wünscht


Wir können die Option redirect: verwenden, die in der Option router.js hinzugefügt wurde. Wenn wir zum Beispiel die Benutzer immer auf eine separate Seite umleiten möchten, wenn er die Root- oder Basis-URL / eingibt:

const router = new Router({
  mode: "history",
  base: process.env.BASE_URL,
  routes: [
    {
      path: "/",
      redirect: "/someOtherPage",
      name: "home",
      component: Home,
      // () =>
      // import(/* webpackChunkName: "home" */ "./views/pageView/home.vue"),

    },
   ]
0
Rakibul Haq
<div id="app">
   <a :href="path" />Link</a>
</div>

<script>
      new Vue({
        el: '#app',
        data: {
          path: 'https://www.google.com/'
        }
      });
</script> enter code here
0
Yash

wenn Sie zu einer anderen Seite weiterleiten möchten this.$router.Push({path: '/pagename'})

wenn du mit params routen willst this.$router.Push({path: '/pagename', param: {param1: 'value1', param2: value2})

0
Bagzie

Sie können auch mit parent.location.href = 'url' arbeiten

0
Wouter Schoofs

Navigiere zwischen Vue-Routen routes

Bevorzugte Methode ist router.Push(location, onComplete?, onAbort?)

Weil:

Um zu einer anderen URL zu navigieren, verwenden Sie router.Push. Diese Methode drückt eine Neuer Eintrag in den Verlaufsstapel, wenn der Benutzer auf den Browser klickt. Zurück-Taste werden sie zur vorherigen URL gebracht.

Lesen Sie die Dokumentation HIER .

Zu externer URL navigieren

Sie verwenden keinen Vue-Router für externes Routing, er übernimmt nur das Routing innerhalb Ihrer App. Verwenden Sie dazu Vanilla Js.

window.location = 'http://www.example.com';

oder

location.replace('http://example.com');

oder

window.open('http://example.com');
0
Maxim Shubin