Vue и простой магазин

Я создал приложение Vue, и у меня есть простой магазин:

const paginationStore = {
  data: {
    entitiesDisplayOptions: [
      { value: '1', text: '1' },
      { value: '2', text: '2' },
      { value: '4', text: '4' },
      { value: '999999', text: 'All' },
    ],
    paginationLimits: {
      bottom: 0,
      top: paginationStore.data.entitiesDisplayOptions[0].value
    }
  }
}

Я получаю сообщение об ошибке:

Uncaught TypeError: Cannot read property 'data' of undefined

Почему я не могу установить значение из entityDisplayOptions в paginationStore.data.paginationLimits.top? Что мне делать, чтобы все заработало?

Возможный дубликат Доступ к свойствам объекта внутри объекта

JJJ 10.08.2018 14:39

Почему вы не пользуетесь магазином Vuex?

dziraf 10.08.2018 14:40

Зачем использовать магазин Vuex?

szarancza ze spizu 10.08.2018 14:41

Вы не можете этого сделать. Я имею в виду во время инициализации, поэтому создание объекта как литерала объекта. Вы должны использовать другую технику

Vladislav Ladicky 11.08.2018 15:43
0
4
51
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Ответ принят как подходящий

Вы можете сохранить его в переменной вне определения:

const newEntitiesDisplayOptions = [
      { value: '1', text: '1' },
      { value: '2', text: '2' },
      { value: '4', text: '4' },
      { value: '999999', text: 'All' },
];

const paginationStore = {
  data: {
    entitiesDisplayOptions: newEntitiesDisplayOptions ,
    paginationLimits: {
      bottom: 0,
      top: newEntitiesDisplayOptions[0].value
    }
  }
}

Есть много возможностей. Все, что вам нужно сделать, это помнить, что вы не можете ссылаться на другие свойства объекта в момент создания объекта в форме литерала объекта.

const entitiesDisplayOptions = [
  { value: '1', text: '1' },
  { value: '2', text: '2' },
  { value: '4', text: '4' },
  { value: '999999', text: 'All' },
]

const paginationLimits = {
  bottom: 0,
  top: paginationStore.data.entitiesDisplayOptions[0].value
}

const paginationStore = {
  data: {
    entitiesDisplayOptions,
    paginationLimits
  }
}

Другие вопросы по теме