Các mẫu nâng cao trong Vue
Provide/inject, custom directives, render functions, JSX, teleport, suspense, async components
1Mục đích chính của provide/inject trong Vue 3 là gì?
Mục đích chính của provide/inject trong Vue 3 là gì?
Câu trả lời
Provide/inject cho phép truyền dữ liệu từ một component cha tới bất kỳ component con cháu nào mà không cần truyền props qua từng cấp trung gian. Điều này tránh được 'props drilling', nơi props phải được truyền qua nhiều cấp component không cần đến chúng. Đặc biệt hữu ích để chia sẻ dữ liệu toàn cục như cấu hình theme hoặc trạng thái xác thực.
2Làm thế nào để khai báo một giá trị bằng provide trong một component sử dụng Composition API?
Làm thế nào để khai báo một giá trị bằng provide trong một component sử dụng Composition API?
Câu trả lời
Trong Composition API, sử dụng hàm provide với hai đối số: một key (string hoặc Symbol) và giá trị cần cung cấp. Ví dụ trong setup. Giá trị này sẽ có thể được truy cập bởi các component con cháu thông qua inject. Sử dụng Symbol làm key đảm bảo tính duy nhất và tránh xung đột tên.
3Chức năng chính của directive Teleport trong Vue 3 là gì?
Chức năng chính của directive Teleport trong Vue 3 là gì?
Câu trả lời
Teleport cho phép render nội dung của một component vào một node DOM khác với vị trí của nó trong cây component của Vue. Thường được dùng cho modal, tooltip và thông báo cần được render ở gốc của tài liệu để tránh các vấn đề về z-index và định vị CSS. Component vẫn giữ được context Vue của nó và có thể truy cập dữ liệu của component cha.
Thuộc tính nào là bắt buộc để sử dụng Teleport trong Vue 3?
Custom directive trong Vue là gì?
+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)
Composition API
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
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í