1. 映射

原写法

  if(selectNode.value==='1-1'){
    formData.value.type = '0'
    formData.value.status = '0'
  }else if(selectNode.value==='1-2'){
    formData.value.type = '0'
    formData.value.status = '1'
  }else if(selectNode.value==='2-1'){
    formData.value.type = '1'
    formData.value.status = '0'
  }else if(selectNode.value==='2-2'){
    formData.value.type = '1'
    formData.value.status = '1'
  }else{
    formData.value.type = '2'
    formData.value.status = '1'
  }

新写法

const mappings = {
  '1-1': { type: '0', status: '0',prop:'outstandingTasksList' },
  '1-2': { type: '0', status: '1' ,prop:'completedTaskList' },
  '2-1': { type: '1', status: '0' ,prop:'pendingProcessList' },
  '2-2': { type: '1', status: '1' ,prop:'processedList' },
  default: { type: '2', status: '1' ,prop:'monitoringInfoList' }
};

const { type, status } = mappings[selectNode.value] || mappings.default;
formData.value.type = type;
formData.value.status = status;

同理

// 原写法

const monitoringInfoList = ref([])
const pendingProcessList = ref([])
const outstandingTasksList = ref([])
const processedList = ref([])
const completedTaskList = ref([])

const mappings = {
  '1-1': { type: '0', status: '0',prop:'outstandingTasksList' },
  '1-2': { type: '0', status: '1' ,prop:'completedTaskList' },
  '2-1': { type: '1', status: '0' ,prop:'pendingProcessList' },
  '2-2': { type: '1', status: '1' ,prop:'processedList' },
  default: { type: '2', status: '1' ,prop:'monitoringInfoList' }
};


const { prop } = mappings[selectNode.value] || mappings.default;

 if(prop==='outstandingTasksList'){
      outstandingTasksList.value = res.rows
    }else if(prop==='completedTaskList'){
      outstandingTasksList.value = res.rows
    }else if(prop==='pendingProcessList'){
      pendingProcessList.value = res.rows
    }else if(prop==='processedList'){
      processedList.value = res.rows
    }else {
      monitoringInfoList.value = res.rows
    }


// 新写法
const mappings = {
  '1-1': { type: '0', status: '0',prop:'outstandingTasksList' },
  '1-2': { type: '0', status: '1' ,prop:'completedTaskList' },
  '2-1': { type: '1', status: '0' ,prop:'pendingProcessList' },
  '2-2': { type: '1', status: '1' ,prop:'processedList' },
  default: { type: '2', status: '1' ,prop:'monitoringInfoList' }
};
// 创建映射对象
const listMappings = {
  outstandingTasksList: outstandingTasksList,
  completedTaskList: completedTaskList,
  pendingProcessList: pendingProcessList,
  processedList: processedList,
  monitoringInfoList: monitoringInfoList
};

// 更新列表函数
const { prop } = mappings[selectNode.value] || mappings.default;
const list = listMappings[prop]
list.value = res.rows;

扫描二维码关注公众号，回复： 17570544 查看本文章