Как вставить объект в массив в vue

Question

Я пытаюсь отправить недавно созданный объект в массив.Массив определяется как

clientengagements: []

Объект -

engagement: []

Поэтому я использую v-for для перебора каждого взаимодействия, принадлежащего клиенту вмассив моих клиентов Все отлично работает, пока я не отправлю новое задание .Это меняет мой массив clientengagements: [], чтобы показать только новый объект.Теперь, если я обновлю страницу, clientengagements: [] вернется к массиву с вновь добавленным объектом и другими уже существующими объектами, что я и хочу сделать.

Это компонент AddEngagementсценарий, который я использую для отправки в хранилищеЯ полагаю, что сталкиваюсь с моей проблемой, но я не выяснил, как решить.Вот код

getClientEngagements(state, clientengagements) {
      state.clientengagements = clientengagements;
    },

Мне рекомендовано использовать Vue.set (), но я не знаю, как его применить .. любая помощь будет принята с благодарностью !!!

Answer 1

.then(response => {
    ...// data transaction 
    context.commit('getClientEngagements', response.data)
})

Может быть, вы можете сначала сделать с данными ответа, а затем сохранить их.

Если данные ответа являются объектом, и вы хотите сохранить только значение, вы можете сделать что-то похожее на это:

for( p in object ){
    context.commit('getClientEngagements', object[p])
}

Если данные ответа являются массивом, то выможно попытаться использовать for, чтобы получить желаемое значение, а затем нажать в состоянии.Для вашего случая вы должны сначала выполнить транзакцию данных в соответствии с вашими потребностями.

Answer 2

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

addClientEngagement(state, engagement) {
      state.clientengagements.push(engagement)
    },

, которую я затем использую в своем действии здесь

addEngagement(context, engagement) {
      axios.post(('/engagements'), {
        client_id: engagement.client_id,
        return_type: engagement.return_type,
        year: engagement.year,
        assigned_to: engagement.assigned_to,
        status: engagement.status,
        done: false
      })
      .then(response => {
        context.commit('addClientEngagement', response.data)
      })
      .catch(error => {
        console.log(error)
      })
    },

, а затем эта мутация происходит

getClientEngagements(state, clientengagements) {
      state.clientengagements = clientengagements
    },

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

addEngagement(state, engagement) {
      state.engagements.push ({
        id: engagement.id,
        client_id: engagement.client_id,
        return_type: engagement.return_type,
        year: engagement.year,
        assigned_to: engagement.assigned_to,
        status: engagement.status,
        done: false
      })
    },

Надеюсь, в моем объяснении есть смысл

Answer 3

Итак, я установил мутацию getClientEngagements, чтобы использовать это сейчас

getClientEngagements(state, engagement) {
      state.clientengagements.push(engagement)
    },

Но, изменив мутацию на эту, она поместила уже существующие объекты в более глубокий вложенный массив.см. ниже

Таким образом, response.data для нового соглашения отправляет только назад из бэкэнда только что добавленное взаимодействие в действии addEngagement.это проблема?