Heim > Web-Frontend > js-Tutorial > Hauptteil

So übergeben Sie Daten mit Vue

php中世界最好的语言
Freigeben: 2018-06-02 14:38:54
Original
1969 Leute haben es durchsucht

Dieses Mal zeige ich Ihnen, wie Sie Vue zum Übertragen von Daten verwenden und welche Vorsichtsmaßnahmen für die Verwendung von Vue zum Übertragen von Daten gelten. Hier ist ein praktischer Fall, schauen wir uns das an.

Komponente ist die leistungsstärkste Funktion von Vue.js. Komponenten können wiederverwendbaren Code kapseln und die Wiederverwendung von Komponenten durch die Übergabe verschiedener Objekte realisieren. Die Übertragung von Komponentenwerten wird jedoch zu einem Problem, das gelöst werden muss.

1. Die übergeordnete Komponente übergibt den Wert an die untergeordnete Komponente.

Der Bereich der Komponenteninstanz ist isoliert. Dies bedeutet, dass die Daten der übergeordneten Komponente nicht direkt in der Vorlage der untergeordneten Komponente referenziert werden können. Damit die untergeordnete Komponente die Daten der übergeordneten Komponente verwendet, müssen wir die props-Option der untergeordneten Komponente übergeben.

Unterkomponente:

子组件需要从父组件获取 logo 的值,就需要使用 props: ['logo']

Wenn die Unterkomponente den Wert des Logos von der übergeordneten Komponente erhalten muss, muss sie Requisiten verwenden: [ 'logo']

So übergeben Sie Daten mit Vue

Übergeordnete Komponente:

So übergeben Sie Daten mit Vue

2 übergeordnete Komponente

Die untergeordnete Komponente übergibt Daten hauptsächlich über das Ereignis an die übergeordnete Komponente.

Unterkomponente:

So übergeben Sie Daten mit VueSo übergeben Sie Daten mit Vue

wobei transferUser ein benutzerdefiniertes Ereignis ist und this.username über dieses Ereignis an die übergeordnete Komponente übergeben wird.

Übergeordnete Komponente:

So übergeben Sie Daten mit VueSo übergeben Sie Daten mit Vue

Der Parameter msg in der getUser-Methode ist der Parameter Benutzername, der von der untergeordneten Komponente

3.RouteÜbergabewert

So übergeben Sie Daten mit VueSo übergeben Sie Daten mit Vue

Bei Verwendung im

Lebenszyklus Aufgabe erstellt.

So übergeben Sie Daten mit Vue

4. Speichern Sie Daten über localStorage oder SessionStorage

So übergeben Sie Daten mit Vue

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website.

Empfohlene Lektüre:

So bedienen Sie JS, um die Stadt und den geografischen Standort des Benutzers zu ermitteln

Verwendung Webpack-Modulmanagement- und Verpackungstools

Das obige ist der detaillierte Inhalt vonSo übergeben Sie Daten mit Vue. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
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