Ich erstelle eine Web-App mit Vue 2.x und Vuex 2.x. Ich hole einige Informationen von einem entfernten Standort über einen http-Anruf, ich möchte, dass, wenn dieser Anruf fehlschlägt, ich zu einer anderen Seite umleiten sollte.
%Vor% Aber this.$router.push({path:"/"}) gibt mir folgenden Fehler.
Uncaught (in Versprechung) TypeError: Eigenschaft 'push' von undefined
kann nicht gelesen werden
Wie kann das erreicht werden?
Simulierte JsFiddle: hier
Es sieht so aus, als würden Sie Ihren Router nicht in Ihre App einspeisen, daher ist er undefiniert
In früheren Versionen von vue-router würden Sie: Vue.use(VueRouter) , mit 2.0 können Sie den Router wie folgt in die App injizieren:
Dies sollte dann als this.$router in der App verfügbar machen
Nach Beantwortung einer verwandten Frage: Wie zu verwenden Vue Router von Vuex-Status? es scheint, dass Vuex die Router-Instanz nicht bei this.$router erhalten wird. Daher wurden zwei Methoden vorgeschlagen, um den Zugriff auf die Router-Instanz zu ermöglichen.
Die erste ist direkter, bei der ein globales Webpack für die Instanz festgelegt wird.
Die zweite besteht darin, Promises mit Ihrer vuex-Aktion zu verwenden, die es Ihren Komponenten ermöglicht, ihre Referenz auf die Router-Instanz zu verwenden, nachdem die Aktionen Promise-Auflösung / Ablehnung ausgeführt wurden.
Ich mochte es nicht, den Standortstatus meiner App getrennt vom Rest meines App-Status im Store zu halten und sowohl einen Router als auch einen Store zu verwalten. Daher habe ich ein Vuex-Modul erstellt, das den Standortstatus verwaltet in dem Store.
Jetzt kann ich, wie jede andere Statusänderung, auch Aktionen ausführen:
%Vor%Dies hat den zusätzlichen Vorteil, dass Sie Dinge wie animierte Seitenübergänge einfacher handhaben können.
Es ist nicht schwer, dein eigenes router -Modul zu rollen, aber du kannst mein auch ausprobieren, wenn du willst:
Tags und Links javascript vue.js vuex