Computed property with arguments works but not a suggested way to do it in vuejs? So what are other available options?

Question

I have a component with v-for on list and I want to check if the component is checked or not whenever there is change in the list and update the checked state.

// This works but not the suggested way to do it.
const list = computed(() => (value) => {
  return array.value.find((item) => item.id === value)
})

// Component inside template
<somecomponent v-for='item in Items' :checked='list(item.id)' />

Answer 1

To achieve this I added computed property returning an array which includes id if they are checked and than use includes to check if id is true or false.
Here Items and array both has different values and just same id. So can't compare directly with includes.

const checkedList = computed(() => {
 const list = [];
 Items.value.forEach((item) => {
    array.value.find((value) => {
      if(value.id === item.id){
        list.push(item.id);
      }
    })
 })
 return list;
})

// Component inside template
<somecomponent v-for='item in Items' :checked='checkedList.includes(item.id)' />

As the checkedList is getting updated on change of value. The value passed to the component will also be updated by the vue.