前端vue优雅的写出描述列表，el-descriptions，思路分享【随记】

对于代码的优雅来说，可能每个人的看法是不一样的，但是对我来说，简洁，易懂，容易维护，就够了。

接下来这段代码是封装组件时用到的，主要是当时的详情弹窗要弹得东西太多了。

这只是一个思路，一种启发。

能够做到思路打开是最好的，不要局限在这一种方法里，大家有更好的思路，欢迎讨论。

{{ detailList[item.key] }}

export default {data() {return {// 自己定义的字典，通过v-for把描述列表循环出来// lable是这个列表描述列表要显示的lable// key是后端返回的数据中的字段detailDict: [{ label: '姓名', key: 'name'},{ label: '性别', key: 'sex' },{ label: '出生年月', key: 'birthday'},{ label: '民族', key: 'nation'},{ label: '籍贯', key: 'nativeplace'},{ label: '出生地', key: 'birthplace'},{ label: '入党时间', key: 'timeOfJoinTheCommunistParty'},{ label: '参加工作时间', key: 'timeOfWorkStart' },{ label: '健康状况', key: 'healthyStatus' },{ label: '专业技术职务', key: 'professionalSkillPosition'},{ label: '熟悉专业有何专长',key: 'speciality'},{ label: '现任职时间',key: 'timeInJob'},{ label: '任同级职务时间', key: 'timeInSameLevelJob'},{ label: '任同级职务时间', key: 'timeInSameLevelJob' },{ label: '全日制教育学历', key: 'fullTimeEducation'},{ label: '全日制教育学位', key: 'fullTimeEducationXuewei'},{ label: '全日制教育毕业院校', key: 'fullTimeProfessionAndSchool'},{ label: '全日制教育专业', key: 'fullTimeProfessionAndSchoolXuewei'},{ label: '在职制教育学历', key: 'inServiceEducation'},{ label: '在职制教育学位', key: 'inServiceEducationXuewei' },{ label: '在职制教育毕业院校', key: 'inServiceProfessionAndSchool'},{ label: '在职制教育专业', key: 'inServiceProfessionAndSchoolXuewei'},{ label: '现任职务', key: 'presentDuty' },{ label: '拟任职务', key: 'toProposedDuty' },{ label: '拟免职务', key: 'toAvoidDuty'},{ label: '简历', key: 'resume'},{ label: '奖惩情况', key: 'rewardsAndPunishment' },{ label: '年度考核结果', key: 'annualAssessmentResult' },{ label: '任免理由', key: 'reasonOfAppointAndDismiss' }]}}}