Yeah I did have the same problem when I wanted to use a computed on a reactive array
// This computed won't updateconsttodos=reactive([])constuncompletedCount=computed(()=>todos.filter(t=>!t.completed).length)// Updates correctly the computedconsttodos=ref([])constuncompletedCount=computed(()=>todos.value.filter(t=>!t.completed).length)
Does anyone knows how to make this example work? It seems that computed with reactive data doesn't updated at any but why is so? (Strange enough I can see in Vue DevTools, that sometimes the value for this reactive computed get somehow updated, but as soons as I open DevTools it won't anymore).
It will only work if inside reactive we define an object because, as I understand it, reactive expectes some properties to work with,. Therefore there must be an object passed. I think Vue should handle this case much better and output some sort of an error or a warning to the console.
For example the code below will update the value as intended:
Yeah I did have the same problem when I wanted to use a computed on a reactive array
Does anyone knows how to make this example work? It seems that computed with reactive data doesn't updated at any but why is so? (Strange enough I can see in Vue DevTools, that sometimes the value for this reactive computed get somehow updated, but as soons as I open DevTools it won't anymore).It will only work if inside
reactive
we define an object because, as I understand it,reactive
expectes some properties to work with,. Therefore there must be an object passed. I think Vue should handle this case much better and output some sort of an error or a warning to the console.For example the code below will update the value as intended:
An array is an Object.