Objek data di Vue
Dasar dari sebuah komponen adalah data,
yang akan kita manipulasi.
Data ini disimpan dalam objek khusus
data. Objek ini
harus dikembalikan sebagai hasil
dari metode khusus:
export default {
data() {
return {
}
}
}
Mari kita simpan di properti objek data beberapa teks:
data() {
return {
text1: '111',
text2: '222',
}
}
Data yang disimpan dapat ditampilkan di tampilan. Ini dilakukan dengan tanda kurung kurawal ganda, di mana nama properti ditulis, yang nilainya ingin kita tampilkan. Mari kita tampilkan nilai properti kita:
<template>
{{ text1 }}
{{ text2 }}
</template>
Dan sekarang mari kita buat agar setiap pesan kita ditampilkan di paragrafnya masing-masing:
<template>
<p>{{ text1 }}</p>
<p>{{ text2 }}</p>
</template>
Misalkan di data disimpan nama depan
dan nama belakang pengguna:
data() {
return {
name: 'john',
surn: 'smit',
}
}
Tampilkan setiap properti di
tag div terpisah.
