`ref` vs `reactive` — khác nhau gì? Dùng khi nào?

ref: wrap bất kỳ giá trị nào (primitives, objects) thành reactive container — truy cập qua .value trong script, tự unwrap trong template.
reactive: wrap object/array thành reactive Proxy — truy cập trực tiếp, không cần .value.

Khuyến nghị hiện tại (Vue 3.2+): Dùng ref cho tất cả — kể cả objects. Vue core team đã cập nhật docs ưu tiên ref universally vì reactive có gotchas: mất reactivity khi destructure, mất reactivity khi re-assign cả object. reactive chỉ nên dùng khi cần nhóm nhiều state liên quan.
Pitfall: destructure từ reactive sẽ mất reactivity — dùng toRefs():

const state = reactive({ count: 0, name: 'Vue' })
const { count, name } = toRefs(state) // giữ reactivity