Heim > Web-Frontend > uni-app > Hauptteil

So implementieren Sie Referenzen zwischen Seiten in Uniapp (zwei Methoden)

PHPz
Freigeben: 2023-04-14 15:38:01
Original
3211 Leute haben es durchsucht

In Uniapp müssen wir oft auf einer Seite auf den Inhalt einer anderen Seite verweisen. Hier stellen wir zwei Methoden zum Implementieren von Referenzen zwischen Seiten vor.

Methode 1: Seitenpfad verwenden

Wir können den Seitenpfad verwenden, um eine andere Seite einzuführen, zum Beispiel:

<template>
  <view>
    <other-page></other-page>
  </view>
</template>

<script>
  import OtherPage from '@/pages/other-page/other-page.vue'
  export default {
    components: {
      OtherPage
    }
  }
</script>
Nach dem Login kopieren

Im obigen Beispiel haben wir <other-page>im Template >-Tag verwendet Führen Sie dann die Vue-Komponente einer anderen Seite im Skriptabschnitt ein und registrieren Sie die Komponente in Komponenten. Auf diese Weise können wir <other-page> auf dieser Seite verwenden, um auf den Inhalt einer anderen Seite zu verweisen. <other-page>标签,然后在script部分引入了另一个页面的vue组件,并且在components中注册了该组件。这样,我们就可以在本页面中使用<other-page>来引用另一个页面的内容。

需要注意的是,这里的路径@/pages/other-page/other-page.vue是相对于项目根目录的,实际路径可能会根据项目结构不同而有所区别。

方法二:使用Page组件的navigateTo方法

另一种方法是使用Page组件的navigateTo方法,例如:

<template>
  <view>
    <button @click="goToOtherPage">跳转到另一个页面</button>
  </view>
</template>

<script>
  export default {
    methods: {
      goToOtherPage() {
        uni.navigateTo({
          url: '/pages/other-page/other-page'
        })
      }
    }
  }
</script>
Nach dem Login kopieren

在上面的例子中,我们在template中使用了一个按钮,然后在script部分编写了goToOtherPage方法,在该方法中使用了uni.navigateTo方法来跳转到另一个页面。需要注意的是,路径'/pages/other-page/other-page'

Es ist zu beachten, dass der Pfad hier @/pages/other-page/other-page.vue relativ zum Projektstammverzeichnis ist. Der tatsächliche Pfad kann je nach Projektstruktur variieren.

Methode 2: Verwenden Sie die „navigateTo“-Methode der „Page“-Komponente🎜🎜Eine andere Methode besteht darin, die „navigateTo“-Methode der „Page“-Komponente zu verwenden, zum Beispiel: 🎜rrreee🎜Im obigen Beispiel haben wir eine Schaltfläche in der Vorlage verwendet und diese dann geschrieben Im Skriptabschnitt wird die Methode goToOtherPage verwendet, und in dieser Methode wird die Methode uni.navigateTo verwendet, um zu einer anderen Seite zu springen. Es ist zu beachten, dass der Pfad '/pages/other-page/other-page' als Pfad der tatsächlichen Seite ausgefüllt werden sollte und auch Parameter, Abfragen und andere Informationen enthalten kann. 🎜🎜Mit beiden oben genannten Methoden können Sie den Inhalt einer anderen Seite in Uniapp einführen. Welche Methode Sie wählen, hängt von Ihren eigenen Bedürfnissen und der Projektstruktur ab. 🎜

Das obige ist der detaillierte Inhalt vonSo implementieren Sie Referenzen zwischen Seiten in Uniapp (zwei Methoden). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage