1.2 KiB
1.2 KiB
前端 Vue 约束
- Vue 自定义组件中,使用模板标签时应该使用全小写,如 -
- Vue 模板中如果要使用变量则应该使用 v-text 而不是插值符号以避免渲染延时,如果只是纯文本不要使用 v-text
- Vue Composition API 的代码应该按功能模块分组,相同的变量、函数等在一个片段,公共的在脚本头部,不同模块之间变量、函数不穿插
- 样式应该写在 Vue 组建的 style 中,不要在原生 html 标签使用 style 属性
- 保持组件小而集中, 提取逻辑的可组合项
前端 Vue 组件代码风格约束
- 使用 Composition API,
- 使用 setup 语法糖
- 使用 unplugin-auto-import 和 unplugin-vue-components 自动导入
- Composition API 的代码应该按功能分区域,如以下代码示例
// 引用、公共变量、函数
const common = ref('common');
// ---------- 功能 1 ----------
// 功能 1 变量
// 功能 1 计算属性
// 功能 1 函数
// 功能 1 生命周期
onMounted(() => {});
// ---------- 功能 2 ----------
// 功能 2 变量
// 功能 2 计算属性
// 功能 2 函数
// 功能 2 生命周期
onMounted(() => {});