Data-objektet i Vue

Grundlaget for en komponent er data, som vi vil manipulere. Disse data gemmes i et specielt objekt data. Dette objekt skal returneres som resultatet af en speciel metode:

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

Lad os gemme en eller anden tekst i en egenskab af dataobjektet:

App.vuedata() {
  return {
    text1: '111',
    text2: '222',
  }
}

De lagrede data kan vises i presentationen. Dette gøres i dobbelte krøllede parenteser, hvor navnet på egenskaben skrives, hvis værdi vi ønsker at vise. Lad os vise værdierne af vores egenskaber:

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

Og lad os nu gøre det så hvert af vores beskeder vises i deres eget afsnit:

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

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