Аб'ект data у Vue

Асновай кампанента з'яўляюцца даныя, якімі мы будзем маніпуляваць. Гэтыя даныя захоўваюцца ў спецыяльным аб'екце data. Гэты аб'ект павінен вяртацца вынікам спецыяльнага метаду:

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

Давайце будзем захоўваць ва ўласцівасці аб'екта з данымі які-небудзь тэкст:

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

Даныя, якія захоўваюцца, можна выводзіць у прадстаўленні. Гэта робіцца ў двайных фігурных дужках, у якіх пішацца імя ўласцівасці, значэнне якога мы хочам вывесці. Давайце выведзем значэнні нашых уласцівасцей:

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

А цяпер зробім так, каб кожнае з нашых паведамленняў выйшла ў сваім абзацы:

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

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