Based on this article from Anthony Fu (a Vue.js champion) we can summarize it in these points:

• refs are considered as primitives values
• reactives as objects
• refs only mutated by .value property, but reactive with any nested property
• reactives looks like plain objects
• reactive objects have some caveats like loosing reactivity when they are destructed.
• reactive objects should be wrapped with function when they're watched like watch(()=>reactiveObj,(newVal,oldVal)...., unlike refs which are unwrapped watch(refProp,(newVal,oldVal)....

Conclusion :

I’d say go with ref whenever you can