组合式函数必须以use开头,采用小驼峰命名如usetoggle、userequest;文件名与函数名一致,存放于src/composables/目录,坚持一函数一文件原则。

组合式函数必须以 use 开头,这是 Vue 官方和社区统一约定,也是 TypeScript 类型推导、工具链识别(如 Volar)的基础前提。
函数名主体:用动词或名词表达明确意图
名称后半部分要让人一眼看懂功能,避免模糊词:
-
✅ 推荐:
useToggle(开关状态)、useRequest(发起请求)、usePagination(分页控制)、useScrollToBottom(滚动到底部)、useUserForm(用户表单整套逻辑) -
❌ 避免:
useData(什么数据?加载?缓存?校验?)、useHandle(处理什么?谁触发?)、useLogic(毫无语义)
命名风格:严格使用小驼峰(camelCase)
全小写开头,后续单词首字母大写,不加下划线、短横线或空格:
-
✅ 正确:
useLocalStorage、useDebounce、useTableSelection -
❌ 错误:
use-local-storage、use_local_storage、UseLocalStorage
文件命名:与函数名一致,后缀为 .ts 或 .js
放在 src/composables/ 目录下,文件名直接对应函数名:
-
src/composables/useAuth.ts→ 导出useAuth() -
src/composables/useCountdown.ts→ 导出useCountdown() - 不建议一个文件导出多个 use 函数,保持“一函数一文件”
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!










