Question 1

Hệ thống reactive của Vue là gì?

Accepted Answer

Hệ thống reactive của Vue tự động phát hiện các thay đổi trong dữ liệu và cập nhật DOM tương ứng. Nó dựa trên các Proxy của JavaScript để chặn việc truy cập và sửa đổi thuộc tính. Hệ thống này đảm bảo giao diện người dùng luôn được đồng bộ với trạng thái ứng dụng mà không cần can thiệp thủ công.

Question 2

Sự khác biệt chính giữa ref() và reactive() là gì?

Accepted Answer

ref() tạo một tham chiếu reactive cho một giá trị primitive hoặc object, được truy cập qua .value, trong khi reactive() tạo một proxy reactive của một object mà không cần .value để truy cập các thuộc tính. ref() có tính phổ quát (primitive + object) và lý tưởng cho các giá trị đơn giản, còn reactive() được tối ưu cho object nhưng không hoạt động với primitive. Trong thực tế, ref() thường được ưa chuộng hơn vì nó hoạt động với mọi kiểu dữ liệu.

Question 3

Làm thế nào để truy cập giá trị của một ref trong template so với trong script?

Accepted Answer

Trong template, Vue tự động unwrap các ref, cho phép truy cập trực tiếp mà không cần .value (ví dụ: {{ count }}). Trong script, bạn phải dùng .value để đọc hoặc sửa giá trị của ref (ví dụ: count.value++). Hành vi tự động này trong template giúp đơn giản hóa việc viết code trong khi vẫn duy trì sự kiểm soát rõ ràng trong logic JavaScript.

Tính reactive của Vue

Hệ thống reactive của Vue là gì?

Câu trả lời

Sự khác biệt chính giữa ref() và reactive() là gì?

Câu trả lời

Làm thế nào để truy cập giá trị của một ref trong template so với trong script?

Câu trả lời

Điều gì xảy ra nếu bạn destructure một object reactive()?

toRefs() trong Vue dùng để làm gì?

Các chủ đề phỏng vấn Vue.js / Nuxt.js khác

Kiến thức nền tảng JavaScript

JavaScript hiện đại (ES6+)

Kiến thức cơ bản về Vue

Component Vue

Vue Router

Pinia State Management

Vuex (Legacy)

Composition API

Kiến thức cơ bản về Nuxt

Data Fetching trong Nuxt

SSR & SSG trong Nuxt

Server Routes Nuxt

Module Nuxt

Composables trong Vue

Form & Validation Vue

Quản lý trạng thái Nuxt

Testing trong Vue

Triển khai Nuxt & CI/CD

Hiệu năng Vue

Các mẫu nâng cao trong Vue

TypeScript với Vue

Xác thực Nuxt

SEO với Nuxt

Quốc tế hóa trong Nuxt

Kiến trúc Vue

Bảo mật Nuxt

Hệ sinh thái Vue

Di chuyển Vue 2→3 & Nuxt 2→3

Nắm vững Vue.js / Nuxt.js cho lần phỏng vấn tiếp theo