Почему кнопка «удалить» срабатывает после нескольких перезагрузок страницы?

Question

[purry]

Здравствуйте, возникла проблема, кнопка удалить срабатывает только тогда, когда я перезагружаю страницу раза 2-3, а до этого он выводит ошибку:

TypeError: Cannot read properties of undefined (reading 'filter')
at Proxy.removeContact (App.vue:52:45)

Я использую Vue 3, Vuex, Axios.
Код кнопки:

async removeContact(id) {
      await this.$store.dispatch('DEL_CONTACTS', id);
      this.contacts = this.contacts.filter(c => c.id !== id);
},

Код из actions:

DEL_CONTACTS: async (context, id) => {
      await axios.delete(`/api/contacts/${id}`);
      context.commit("REMOVE_CONTACTS", id)
}

Код мутации:

REMOVE_CONTACTS: (state, id) => {
      state.contacts = state.contacts.filter(c => c.id !== id);
},

Answer 1

[purry]

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