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?