Vuex - обновить весь объект внутри массива

Question

Внутри моей мутации Vuex я хочу заменить элемент массива в моем состоянии, как показано ниже:

UPDATE_MAILING(state, mailing) {
    let index = _.findIndex(state.mailings, {id: mailing.id});

    state.mailings[index] = mailing
}

Но это не обновляет мой шаблон, связанный с этим массивом. Как я могу реактивно обновить элемент массива?

Answer 1

Вы должны использовать Vue.$set (или this.$set внутри экземпляра Vue):

UPDATE_MAILING(state, mailing) {
    let index = state.mailings.findIndex(item => item.id === mailing.id)
    Vue.$set(state.mailings, index, mailing)
}

Документы: Vue.js → Реактивность в глубине

Answer 2

Вы можете использовать Array.prototype.splice для реактивной замены элемента:

mutations: {
  UPDATE_MAILING(state, mailing) {
    const index = state.mailings.findIndex(x => x.id === mailing.id);
    state.mailings.splice(index, 1, mailing); ?
  }
}

демо

Answer 3

Я хочу вам сказать, что если вы хотите использовать оператор типа Array, вам лучше использовать mthod, например, splice slice pop push shift unshift, только вы используете thisl, шаблон может быть привязан к вашему массиву.Не используйте массив [index] для оператора;надеюсь помочь вам искренне