美文网首页
vue项目规则

vue项目规则

作者: 小蜗牛的碎碎步 | 来源:发表于2020-01-09 15:48 被阅读0次
    要遵守的规则
    1. 组件名为多个单词,用短线连接,如:todo-item

    2. 组件的data必须为函数

    3. props的定义应尽量详细(标明变量的类型、默认值等)

    4. 为v-for设置键值(key)

    5. 避免v-for和v-if一起使用

    6. 组件样式添加作用域scoped(避免不同组件间的样式污染)

    7. class名称遵循BEM规范
      https://www.w3cplus.com/css/bem-definitions.html

    8. 私有属性名用$my或者mMy

    最好遵守的规则
    1. 把每个组件单独作为文件
    2. 组件文件的大小写:MyComponent
    3. 基础组件名:Bass / App/V
    4. 和父组件紧密耦合的子组件应该以父组件名作为前缀,如:
    TodoList.vue -> TodoListItem.vue
    
    1. 组件名以高级别的单词开头,以描述性的修饰词结尾。
    2. 在单文件组件、字符串模板和JSX中,没有内容的组件应该是自闭合的(<MyComponent/>)。在DOM模板中为<my-component></my-component>
    3. JS/JSX中的组件名大小写
    export default{name:MyComponent}
    import MyComponent from '@/MyComponent'
    
    1. 组件名应该倾向于完整单词,而不是缩写(名称过长没关系,只要能表达清楚意思)
    2. prop命名大小写
    <welcomeMessage gretting-text = 'hi'/>
    props:{greetingText:string}
    
    1. 多个特性的元素分多行编写,每个特性一行
    <img
        src = './logo.png'
        alt = 'logo'
    />
    
    1. DOM中的表达式改为计算属性
    2. 将复杂的计算属性分为多个简单属性
    3. 带引号的特性值
    <input type = "text"/>
    <AppSlidebar :style="{width:w+'px'}"/>
    
    1. 指令缩写都用或者都不用

    相关文章

      网友评论

          本文标题:vue项目规则

          本文链接:https://www.haomeiwen.com/subject/tebyactx.html