Vue в data использовать getter текущего объекта

178

13 ноября 2018, 19:40

Допустим у нас есть такой код

data() {
 return {
  payinRange: window.__DATA__.payinRange,
  payinStruct: window.__DATA__.payinStruct
 }
}

2 раза не очень хочется обращаться к глобальному объекту, по этому я хотел использовать getter и сделать например так:

DATA: window.__DATA__,
get payinRange () { this.DATA.payinRange },
get payinStruct () { this.DATA.payinStruct },

но тогда переопределяется контекст вызова ф-ции и this.DATA уже undefined, есть ли способ присвоить значения в data не обращаясь 2 раза к глобальной переменной?

Answer 1

Нужно инициализировать данные в хуках жизненного цикла Vue, если начальных значений нет можно указать null или пустой строкой '':

// es6 
...
data() {
  return {
    payinRange: null,
    payinStruct: null
  }
}, 
created() {
  // let data = ... // ? но зачем
  // const DATA = window.__DATA__; // ? но зачем
  // Лучше добавить валидацию и предупреждения об ошибках
  // window.__DATA__ = window.__DATA__ || {}
  // this.payinRange = window.__DATA__.payinRange || <default value>
  this.payinRange = window.__DATA__.payinRange 
  this.payinStruct = window.__DATA__.payinStruct
},
...

На заметку: Объект присваивается и копируется «по ссылке». В переменной хранится не сам объект, а адрес в памяти.

Используйте Vuex для управления состоянием приложения.

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

При запуске сервера nodejs возникает ошибка

Делаю всё по книжке "Стек MEAN" но не получается даже привет экспресс Запустить

183

javascript

Slider Pro вертикальные минатюры

как в слайдере Slider Pro сделать вертикальные миниатюры справа как здесь

161

javascript

Проблема при скрытии меню

есть хедер с меню, при наведении на лишку появляется меню (изменение стейта, свойство isOpen), в меню много li, каждая это запрос по REST на получение...

167

javascript

Увеличить картинку при клике

156