Composition API
Setup function, ref, reactive, computed, watch, lifecycle hooks, composables, script setup
1Composition API trong Vue 3 là gì?
Composition API trong Vue 3 là gì?
Câu trả lời
Composition API là một cách mới để tổ chức logic của component Vue bằng cách dùng các composition function thay cho các options (data, methods, computed). Nó cho phép nhóm logic theo tính năng thay vì theo loại option, giúp tái sử dụng code dễ dàng hơn thông qua composable. Nó cũng hỗ trợ TypeScript tốt hơn và giúp tổ chức các component phức tạp hiệu quả hơn.
2Hàm chính được sử dụng trong Composition API để định nghĩa logic của một component là gì?
Hàm chính được sử dụng trong Composition API để định nghĩa logic của một component là gì?
Câu trả lời
Hàm setup() là điểm khởi đầu của Composition API. Nó được thực thi trước khi component được tạo, thậm chí trước cả created(). Nó nhận props và context làm tham số và phải trả về một object chứa dữ liệu cùng các hàm được phơi bày ra template. Chính trong setup() mà ta sử dụng ref, reactive, computed, watch và các lifecycle hooks của Composition API.
3Sự khác biệt chính giữa ref() và reactive() là gì?
Sự khác biệt chính giữa ref() và reactive() là gì?
Câu trả lời
ref() tạo một tham chiếu reactive cho một giá trị primitive hoặc một object, được truy cập qua .value trong script (nhưng được tự động unwrap trong template). reactive() chỉ tạo một proxy reactive cho object và array, không cần .value nhưng sẽ mất tính reactive nếu bị destructure. ref() linh hoạt hơn cho các giá trị primitive, còn reactive() tự nhiên hơn cho các object phức tạp nhưng cần toRef/toRefs khi destructure.
Làm thế nào để truy cập giá trị của một ref trong hàm setup()?
Làm thế nào để tạo một computed property trong Composition API?
+21 câu hỏi phỏng vấn
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)
Tính reactive của Vue
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
Truy cập tất cả câu hỏi, flashcards, bài kiểm tra kỹ thuật, bài tập code review và mô phỏng phỏng vấn.
Bắt đầu miễn phí