გამოთვლადი თვისებები Vue-ში

შესაძლებელია თვისებების განსაზღვრა, რომლებიც რეაქტიულად გამოითვლება სხვა თვისებების საფუძველზე. ასეთ თვისებებს ეძახიან გამოთვლად თვისებებს. ისინი მდებარეობს კონფიგურაციაში computed.

მოდით შევხედოთ მაგალითს. დავუშვათ, თვისებებში ინახება მომხმარებლის სახელი და გვარი:

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

მოდით შევქმნათ თვისება full, რომელიც შეიცავს სრულ სახელს გვარით:

javascriptcomputed: {
  full: function() {
    return this.name + ' ' + this.surn;
  }
}

გამოვიტანოთ ჩვენი თვისებების შიგთავსი წარმოდგენაში:

App.vue<template>
  <p>{{ name }}</p>
  <p>{{ surn }}</p>
  <p>{{ full }}</p>
</template>

გამოთვლადი თვისებები იცვლება რეაქტიულად. ეს ნიშნავს, რომ თუ ჩვენ შევცვლით სახელს ან გვარს, მაშინ ჩვენი თვისება full ავტომატურად რეაქტიულად შეიცვლება და ჩვენ დაუყოვნებლივ დავინახავთ ცვლილებებს ეკრანზე.