Question

0

227

Views

"Write operation failed: computed property "posts" is readonly"

I try remove post from PostList, but getting an error

<PostList
    :posts="sortedAndSearchedPosts"
    @remove="removePost"
    v-if="!isPostsLoading"
  />

remove post function

 removePost(post) {
      this.posts = this.posts.filter((p) => p.id !== post.id);
    },

posts initialized here

 computed: {
    ...mapState({
      posts: (state) => state.post.posts,
    }),
    ...mapGetters({
      sortedPosts: "post/sortedPosts",
      sortedAndSearchedPosts: "post/sortedAndSearchedPosts",
    }),
  },

about 4 years ago · Juan Pablo Isaza

1 answers

Answer question

0

Answer question

Find remote jobs

Answer 1 · 2022-06-28T07:50:27.889Z

Not clear where this.posts are actually initially set up. If I guess your architecture right, I see 2 options for you:

either directly remove the post in your store so that sortedAndSearchedPosts reflects the change directly
if you don't want to update the global state, build a local copy when you initialise posts:

data () {
   return {
      posts: [...this.sortedAndSearchedPosts],
      ...
   }
},

and update your code to use the local list of posts:

<PostList
    :posts="posts"
    ...
  />

Hope this helps!

0

227

"Write operation failed: computed property "posts" is readonly"

1 answers

0

Find remote jobs

Andres GPT