[Vuejs]-How to make a computed prop from two other computed props?

by

0👍

You can combine the properties by using the first as the basis for the second. For example, if you want to filter the posts and then paginate

paginatedData() {
    const start = this.page * 10;
    const end = start + 10;
    return this.filteredPosts.slice(start, end);
},
filteredPosts() {
    return this.posts.filter((post) => {
      return post.title.match(this.search);
    });
},

Or if you want to paginate and then filter

paginatedData() {
    const start = this.page * 10;
    const end = start + 10;
    return this.posts.slice(start, end);
},
filteredPosts() {
    return this.paginatedData.filter((post) => {
      return post.title.match(this.search);
    });
},

In your template, use whichever computed property is your desired ultimate output (paginatedData in the first case, filteredPosts in the second).

Leave a comment