Discussion on: Thought on Vue 3 Composition API - `reactive()` considered harmful

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:

const todos = reactive({
  state: []
});
const uncompletedCount = computed(
  () => todosReactive.state.filter(t => !t.completed).length
);