Vue.js search functionality In my BlogList.vue component I made a search input field:
&lt;input type=&quot;text&quot; placeholder=&quot;Enter key word  ...&quot; v-model=&quot;search&quot;&gt;

And a computed property:
computed: {
    getfilteredData() {
     return this.blogs.filter(blog =&gt;
        blog.name.toLowerCase().includes(
          this.search.toLowerCase()
        ) ||
        blog.category.toLowerCase().includes(
          this.search.toLowerCase()
        )
      ) 
    }
  },

The user can search on multiple values, blog.name and blog.category, which updates the list accordingly.
But can I write the above JavaScript (computed property) in a cleaner way?
One improvement would be factoring out the repeated call to this.search.toLowerCase() and storing the result in a block-scoped constant so it:

doesn't need to be calculated on every call to .includes() for each iteration of filter()
can decrease the length of each line where that value is used

That may be a small optimization but it is in line with the D.R.Y. principle
getfilteredData() {
  const lowerTerm = this.search.toLowerCase()
  return this.blogs.filter(blog =&gt;
    blog.name.toLowerCase().includes(lowerTerm) ||
    blog.category.toLowerCase().includes(lowerTerm)
  ) 
},

Additionally, it could further be simplified by using Object destructuring to eliminate the need for the identifier blog with the callback to the filter method:
getfilteredData() {
  const lowerTerm = this.search.toLowerCase()
  return this.blogs.filter({name, category} =&gt;
   name.toLowerCase().includes(lowerTerm) ||
   category.toLowerCase().includes(lowerTerm)
  ) 
},