Vue书写规范

template模块:

v-xx指令排序规则,控制显示 -> 控制循环 -> v-bind属性 -> v-on事件绑定;

v-if / v-show -> v-for -> v-bind:text... -> v-on:click...

v-for时,记得为每项提供一个唯一 key 属性

3 不要在html标签上直接写style内联样式, 放到data中或者computed中

4  在大结构块时,加入合适的注释标签,并保持良好的层级缩进

script 模块

  1. import 放在最顶部,并省略掉 .js.json 和 .vue 后缀
  2.  export 对象中属性定义顺序
    name
    components
    props
    data
    computed 计算属性
    watch 监听器
    filters 过滤器
    directives 指令
    mixins 混入   混入方法命名规则:  mixinMixinJSNameFunctionName()
    created/mounted/updated 等各类生命周期函数
    methods 方法  大的规则
     
    1. api接口请求的放在前边
    2. 方法按页面结构从上至下开始定义;
    3. 当前组件方法调用on开头
    4. 子级页面emit方法调用emit开头

style 模块

    1. @import 写在最前;
    2. 样式书写顺序与页面结构一致;
    3. 嵌套层级最多请不要超过3层;
    4. 慎重考虑是否添加 scoped 属性。
posted @ 2020-01-14 17:22  阿萨姆✌️  阅读(321)  评论(0编辑  收藏  举报