So erstellen Sie eine Sprungseite in vue.js

Vue.js implementiert die Sprungseitenmethode: 1. Verwenden Sie das Tag [] zum Springen. 2. Verwenden Sie die Methode [this.$router.push()], wenn nur ein Parameter vorhanden ist . Sie können einen Parameter hinzufügen, um den Wert zu übergeben.

【Empfohlene verwandte Artikel: vue.js】

vue.js-Methode zum Implementieren des Seitensprungs:

Klicken Sie auf das untere Bücherregal, um zur entsprechenden Seite zu springen

<router-link :to="{name: &#39;bookshelf&#39;, params: { entityId: this.entityId } }"
             :class="{&#39;flex-item-1&#39;:&#39;flex-item-1&#39;,cur:tabs[0].isShow}" href="javascript:">
              <span class="tabNav-ico tabNav-book"></span>
              <span class="tabNav-txt">书 架</span>
</router-link>

'Name' : „bookshelf“ gibt den Namen der zu überspringenden Vue-Komponente an. Der Name wird in index.vue unter der Router-Datei festgelegt.

{
     path: '/bookshelf',
     name: 'bookshelf',
     component: Bookshelf
   },

params: {entityId: this.entityId} enthält die zu übergebenden Parameter.

Parameter in der Bookshelf-Komponente empfangen

this.bookshelfId = this.$route.params.entityId;this.bookshelfId = this.$route.params.entityId;

除了使用标签进行跳转，还可以使用下面的方法

<a @click="toIndex" :class="{&#39;flex-item-1&#39;:&#39;flex-item-1&#39;,cur:tabs[2].isShow}" href="javascript:">
      <span class="tabNav-ico tabNav-home"></span>
      <span class="tabNav-txt">首 页</span>
</a>
toIndex: function(){
        this.$router.push("/?entityId="+ localStorage.getItem("entityId"));
}

同样可以跳转页面，this.$router.push()方法只有一个参数的时候，代表跳转地址，还可以增加一个参数传值。

写法：

this.$router.push({name: "deepReadingDetail", params: {'id': data.id, 'title': data.title}});

接收参数：

this.$route.params.title

Zusätzlich zur Verwendung der Bezeichnung Verwenden Sie die folgende Methode:

rrreee

Sie können auch zur Seite springen. Wenn die Methode this.$router.push() nur einen Parameter hat, stellt sie die Sprungadresse dar. Sie können auch einen Parameter hinzufügen, um den Wert zu übergeben. Schreiben:

rrreee

Empfangsparameter: 🎜🎜this.$route.params.title🎜🎜🎜Zugehörige kostenlose Lernempfehlungen: 🎜javascript🎜 (Video) 🎜🎜

Das obige ist der detaillierte Inhalt vonSo erstellen Sie eine Sprungseite in vue.js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!