# Несколько свойств

Для нескольких свойств можно создать объект-алиас, который будет хранить ссылки на отслеживаемые свойства и сам геттер.

# Класс










 
 
 
 
 
 
 











class MultipleObjects {
  firstPerson = {
    name: 'Alex',
  }

  secondPerson = {
    name: 'Dora',
  }

  plus = {
    _first: this.firstPerson,
    _second: this.secondPerson,
    get val() {
      return `${this._first.name} + ${this._second.name}`;
    }
  }

  nextPair() {
    this.firstPerson.name = 'Kirill';
    this.secondPerson.name = 'Diana';
  }
}

const instance = new MultipleObjects();

export default instance;

Подразумевается, что напрямую к изначальным свойствам мы не должны обращаться через этот алиас, хотя это будет работать, но это будет дольше, проще получить оригиналы.

# Компонент





 

















<template>
  <div class="component-block">
    <span class="name">MultiplePropsOne</span>

    <div><b>Пара: </b> {{ plus.val }}</div>
    <button @click="nextPair">Следующая пара</button>
  </div>
</template>

<script>
import MultipleObjects from '@example-services/MultipleObjects';

export default {
  data() {
    return {
      plus: MultipleObjects.plus,
      nextPair: MultipleObjects.nextPair.bind(MultipleObjects),
    };
  },
};
</script>

# Результат

MultiplePropsOne
Пара: Alex + Dora
MultiplePropsTwo
Пара: Alex + Dora
Обновлено: 12/12/2022, 3:53:53 PM