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:

App.vueexport default {
  data() {
    return {
      
    }
  }
}

Mari kita simpan di properti objek data beberapa teks:

App.vuedata() {
  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:

App.vue<template>
  {{ text1 }}
  {{ text2 }}
</template>

Dan sekarang mari kita buat agar setiap pesan kita ditampilkan di paragrafnya masing-masing:

App.vue<template>
  <p>{{ text1 }}</p>
  <p>{{ text2 }}</p>
</template>

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