0

So I have this mutation in my store:

DELETE_POST: (state, index) => {
  state.Posts.splice(index, 1);
}

and I also have this action:

delete({ commit, state }, index) {
  commit('DELETE_POST', index);
}

This action basically deletes a post from an Array of posts, that is returned through vue-apollo.

Dispatching the action in my Vue component this.$store.dispatch('Posts/delete', index);

results in a TypeError: 0 is read-only error

Here's the state of the store:

export const state = () => ({
  Posts: [] 
})

and the mutation responsible for setting posts:

export const mutations = {
  SET_POSTS: (state, posts) => {
    state.Posts = posts;
  },

and here's how we fill the store via a graphql query using apollo client

export const actions = {
  async get({ commit, state }, params) {
    let client = this.app.apolloProvider.defaultClient;
    let { data: response } = await client.query({
      query: GetPostsQuery
      variables: {
        id: parseInt(params.id) || null,
        description: params.description || '',
        categoryId: params.categoryId || null,
      },
      fetchPolicy: 'network-only'
    });
    let postsDetails = response.Posts.get;
    if (postsDetails.status_code !== 200) return false;
      commit('SET_POSTS', postsDetails.data);
    return postsDetails.data;
  },

Is this a vue-apollo problem? and how could I possibly modify the state if so?

Sammi
  • 286
  • 1
  • 3
  • 11

0 Answers0