[Vuejs]-Uncaught (in promise) TypeError: obj.filter is not a function

0👍

You may use it like this:

const obj = reactive({products});
...
const searchedProducts =computed( () => {
    return obj.products.filter(product => productId.includes(product.productId))
    
  
});

0👍

The reason why your getting the error is that your wrapping a ref() inside of the reactive() without the usage of an object so you are need to add an .value to make it work like below. I made a StackBlitz to showcase.

const searchedProducts = computed(() => {
  return obj.value.filter((product) => {
    return product.id === productId;
  });
});`

But you probably intended to do it like the example below to make the ref() value unwrapped:

const obj = reactive({ products });

...

const searchedProducts = computed(() => {
  return obj.products.filter((product) => {
    return product.id === productId;
  });
});

Two other things to point out:

  1. You are using .includes() to compare products ids. A strict comparison would be more reliable to use.
  2. You forgot a return statement.

Leave a comment