template模块:
1 v-xx
指令排序规则,控制显示 -> 控制循环 -> v-bind属性 -> v-on事件绑定;
v-if / v-show
-> v-for
-> v-bind:text...
-> v-on:click...
2 v-for
时,记得为每项提供一个唯一 key
属性
3 不要在html标签上直接写style
内联样式, 放到data中或者computed中
4 在大结构块时,加入合适的注释标签,并保持良好的层级缩进
script
模块
import
放在最顶部,并省略掉.js
,.json
和.vue
后缀-
export
对象中属性定义顺序
name
components
props
datacomputed
计算属性watch
监听器filters
过滤器directives
指令mixins
混入 混入方法命名规则: mixinMixinJSNameFunctionName()created/mounted/updated
等各类生命周期函数methods
方法 大的规则
- api接口请求的放在前边
- 方法按页面结构从上至下开始定义;
- 当前组件方法调用on开头
- 子级页面emit方法调用emit开头
style
模块
@import
写在最前;- 样式书写顺序与页面结构一致;
- 嵌套层级最多请不要超过3层;
- 慎重考虑是否添加
scoped
属性。