vue

toRef/toRefs called on non-reactive object

toRef.*expects a reactive object|toRefs.*not reactive

Fixes

1.Pass a reactive() object to toRefs(), not a plain object or ref
2.Use computed() instead if you need a derived value from a ref
3.Wrap the object with reactive() before passing to toRefs()

vuereactivitytoRefs

Related Errors

Cannot read property of undefined in setup()

Cannot read propert(y|ies) of undefined.*setup

•Initialize reactive refs before accessing nested properties
•Add optional chaining (?.) when accessing potentially undefined objects

Computed property getter returns undefined

computed property.*getter.*undefined

•Ensure computed getter always returns a value
•Check that reactive dependencies are initialized before computed runs

Direct prop mutation warning

Avoid mutating a prop directly

•Use a local data/ref copy of the prop instead of mutating directly
•Emit an event to let the parent update the prop value