Инициализация параметра Vuex значением из массива

Question

У меня есть этот код для Vuex, и я хотел инициализировать значение параметра по умолчанию значением из массива Vuex. Как мне это сделать?

passcode: this.state.passcodes[0].value

Это приводит к ошибке с указанием

Cannot read property 'state' of undefined

const store = new Vuex.Store({
  state: {
    passcodes: [
      {
        label: 'Pass1',
        value: '123456',
      },
      {
        label: 'Pass2',
        value: '654321',
      }
    ],
    data: [
      {
        name: '',
        passcode: this.state.passcode[0].value
      }
    ]
  }
})

Как мне это сделать?

Answer 1

Используйте Getter, как это:

const store = new Vuex.Store({
  state: {
    passcodes: [
      { label: 'Pass1', value: 123456 },
      { label: 'Pass2', value: 654321 }
    ]
  },
  getters: {
    defaultPass: state => {
      return state.passcodes[0]
    }
  }
})

Вы можете получить доступ к настройке по умолчанию через store.getters.defaultPass.

Или такая мутация:

const store = new Vuex.Store({
  state: {
    passcodes: [
      { label: 'Pass1', value: 123456 },
      { label: 'Pass2', value: 654321 }
    ],
    defaultPass: '',
  },
  mutations: {
    default(state, n): {
      state.defaultPass = state.passcodes[n]
    }
  }
})

Затем вы можете установить значение по умолчанию с помощью store.commit('default', 0).

Answer 2

const passcodes = [
  {
    label: 'Pass1',
    value: '123456',
  },
  {
    label: 'Pass2',
    value: '654321',
  }
]

const store = new Vuex.Store({
  state: {
    passcodes,
    data: [
      {
        name: '',
        passcode: passcodes[0].value
      }
    ]
  }
})