Das data-Objekt in Vue

Die Grundlage einer Komponente sind die Daten, mit denen wir manipulieren werden. Diese Daten werden in einem speziellen Objekt data gespeichert. Dieses Objekt muss durch das Ergebnis einer speziellen Methode zurückgegeben werden:

export default {
	data() {
		return {
			
		}
	}
}

Lassen Sie uns einen beliebigen Text in einer Eigenschaft des Datenobjekts speichern:

data() {
	return {
		text1: '111',
		text2: '222',
	}
}

Die gespeicherten Daten können in der Darstellung ausgegeben werden. Dies geschieht in doppelten geschweiften Klammern, in die der Name der Eigenschaft geschrieben wird, deren Wert wir ausgeben möchten. Lassen Sie uns die Werte unserer Eigenschaften ausgeben:

<template>
	{{ text1 }}
	{{ text2 }}
</template>

Und nun sorgen wir dafür, dass jede unserer Nachrichten in einem eigenen Absatz ausgegeben wird:

<template>
	<p>{{ text1 }}</p>
	<p>{{ text2 }}</p>
</template>

Angenommen, in data sind der Vor- und Nachname des Benutzers gespeichert:

data() {
	return {
		name: 'john',
		surn: 'smit',
	}
}

Geben Sie jede Eigenschaft in einem separaten div-Tag aus.