1.组件名、重要方法的名称备注的规则

• 未规范命名

统一命名后的

组件命名规范：模块 + 实体

事件的名称方式：通过$emit（）的事件已toXXXXX命名，eg: $emit(toEmit, data) 组件内的事件命名：onXXXX eg: onEmit

通过统一事件命名的方式，快速定位事件的流转。

2.提高函数使用，避免使用全局变量

• 尽量避免使用全局变量，使用函数返回数据的方式，减少全局变量带来的维护变量困难

onCheckAllChildrenNode(treeData, status) {
      let depList = []
      function addDept(treeData, status) {
        for (let i = 0; i < treeData.length; i++) {
          if (treeData[i].type === 'Department') {
            treeData[i]['excludeChildDepartment'] = status
            depList.push(treeData[i])
          }
          if (treeData[i].children.length > 0) {
            addDept(treeData[i].children)
          }
        }
      }
      addDept(treeData, status)
      return depList
    },

3.多层组件事件使用方法

组件之间事件传递超过三层组件时，可以使用provide方法暴露组件内的方法

// app.vue
provde(){
 return {
  app: ()=> this
 }
     },
    methods: {
 onPanel(data) {
  // 对data做一些处理
 }
     }

one.vue


 methods: {
 onSwitch(data) {
  // 在子组件中触发父组件的方法
  this.app().onPanel(data)
 }
    }

编撰人：yinyanting、admin

快速跳转

• 1.组件名、重要方法的名称备注的规则
• 2.提高函数使用，避免使用全局变量
• 3.多层组件事件使用方法