# Composables trong Vue (Vue.js / Nuxt.js)

> Tạo composables, logic có thể tái sử dụng, useState, useRoute, useRouter, các mẫu composables tùy chỉnh

- 20 câu hỏi phỏng vấn
- Mid-Level
- [Câu hỏi phỏng vấn: Vue.js / Nuxt.js](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van.md)

## 1. Composable trong Vue 3 và Nuxt 3 là gì?

**Câu trả lời**

Composable là một hàm đóng gói logic có thể tái sử dụng bằng cách dùng Composition API của Vue. Composable cho phép chia sẻ state và side effect giữa các component mà không cần dùng đến mixin. Theo quy ước, tên của một composable luôn bắt đầu bằng tiền tố use, giúp dễ dàng nhận diện trong code.

## 2. Quy ước đặt tên được khuyến nghị cho composable là gì?

**Câu trả lời**

Composable luôn nên bắt đầu bằng tiền tố use theo sau là một tên mô tả viết theo camelCase. Quy ước này cho phép nhanh chóng nhận diện composable trong code và phân biệt chúng với các hàm tiện ích thông thường. Ví dụ, useCounter, useFetch hoặc useAuth là những tên phù hợp cho composable.

## 3. Composable nên được đặt ở đâu trong một dự án Nuxt 3?

**Câu trả lời**

Composable nên được đặt trong thư mục composables ở gốc của dự án. Nuxt 3 tự động import tất cả các file từ thư mục này, cho phép sử dụng composable mà không cần import chúng thủ công. Việc auto-import này cải thiện trải nghiệm của lập trình viên và giảm code boilerplate.

## Còn 17 câu hỏi nữa

- Lợi thế chính của useState so với ref trong Nuxt 3 là gì?
- Làm thế nào để truy cập các tham số của route hiện tại trong một composable Nuxt?

Đăng ký miễn phí: https://sharpskill.dev/vi/login

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

- [Kiến thức nền tảng JavaScript](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/javascript-fundamentals.md): 20 câu hỏi, Junior
- [JavaScript hiện đại (ES6+)](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/es6-modern-javascript.md): 20 câu hỏi, Junior
- [Kiến thức cơ bản về Vue](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/vue-basics.md): 22 câu hỏi, Junior
- [Component Vue](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/vue-components.md): 20 câu hỏi, Junior
- [Vue Router](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/vue-router.md): 18 câu hỏi, Junior
- [Pinia State Management](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/pinia-state-management.md): 20 câu hỏi, Junior
- [Vuex (Legacy)](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/vuex-legacy.md): 15 câu hỏi, Mid-Level
- [Composition API](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/composition-api.md): 24 câu hỏi, Mid-Level
- [Tính reactive của Vue](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/vue-reactivity.md): 20 câu hỏi, Mid-Level
- [Kiến thức cơ bản về Nuxt](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/nuxt-fundamentals.md): 22 câu hỏi, Mid-Level
- [Data Fetching trong Nuxt](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/nuxt-data-fetching.md): 20 câu hỏi, Mid-Level
- [SSR & SSG trong Nuxt](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/nuxt-ssr-ssg.md): 22 câu hỏi, Mid-Level
- [Server Routes Nuxt](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/nuxt-server-routes.md): 20 câu hỏi, Mid-Level
- [Module Nuxt](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/nuxt-modules.md): 18 câu hỏi, Mid-Level
- [Form & Validation Vue](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/vue-forms-validation.md): 20 câu hỏi, Mid-Level
- [Quản lý trạng thái Nuxt](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/nuxt-state-management.md): 18 câu hỏi, Mid-Level
- [Testing trong Vue](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/vue-testing.md): 20 câu hỏi, Mid-Level
- [Triển khai Nuxt & CI/CD](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/nuxt-deployment-cicd.md): 22 câu hỏi, Mid-Level
- [Hiệu năng Vue](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/vue-performance.md): 22 câu hỏi, Senior
- [Các mẫu nâng cao trong Vue](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/vue-advanced-patterns.md): 24 câu hỏi, Senior
- [TypeScript với Vue](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/typescript-vue.md): 22 câu hỏi, Senior
- [Xác thực Nuxt](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/nuxt-auth.md): 20 câu hỏi, Senior
- [SEO với Nuxt](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/nuxt-seo.md): 20 câu hỏi, Senior
- [Quốc tế hóa trong Nuxt](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/nuxt-i18n.md): 18 câu hỏi, Senior
- [Kiến trúc Vue](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/vue-architecture.md): 22 câu hỏi, Senior
- [Bảo mật Nuxt](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/nuxt-security.md): 20 câu hỏi, Senior
- [Hệ sinh thái Vue](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/vue-ecosystem.md): 18 câu hỏi, Senior
- [Di chuyển Vue 2→3 & Nuxt 2→3](https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/migration-vue2-vue3-nuxt2-nuxt3.md): 22 câu hỏi, Senior

---

Source: SharpSkill (https://sharpskill.dev), tech interview preparation for your real stack.
HTML version of this page: https://sharpskill.dev/vi/technologies/vue-nuxt/cau-hoi-phong-van/vue-composables