记录：el-table手风琴expand-change事件触发数据请求时重复的问题

<template>   <el-table ref="classTable" :data="classList" style="width: 100%" @expand-change="handleExpandChange">     <el-table-column type="expand">       <template slot-scope="props">         <el-table :data="studentMap[props.row.id]" style="width: 100%">           <el-table-column label="学号" align="center">             <template slot-scope="scope">{{ scope.row.id }}</template>           </el-table-column>           <el-table-column label="学生姓名" align="center">             <template slot-scope="scope">{{ scope.row.name }}</template>           </el-table-column>           <el-table-column label="年龄" align="center">             <template slot-scope="scope">{{ scope.row.age }}</template>           </el-table-column>         </el-table>       </template>     </el-table-column>     <el-table-column label="班级编号" align="center">       <template slot-scope="scope">{{ scope.row.id }}</template>     </el-table-column>     <el-table-column label="班级简称" align="center">       <template slot-scope="scope">{{ scope.row.name }}</template>     </el-table-column>     <el-table-column label="班级全称">       <template slot-scope="scope">{{ scope.row.fullName }}</template>     </el-table-column>     <el-table-column label="班主任" align="center">       <template slot-scope="scope">{{ scope.row.teacher }}</template>     </el-table-column>   </el-table> </template>
<script> export default {   name: 'Table',   data() {     return {       currentClassId: '',       classList: [],       studentMap: {},       getRowKey(row) {         console.log(row.id)         return row.id       },       test: true     }   },   created() {     this.fetchClassList()     this.fetchStudentClassMap()   },   methods: {     fetchClassList() {       this.classList = [{         id: 'class-1',         name: '软工1班',         teacher: '于老师',         fullName: '软件工程学院-软件工程-1班'       }, {         id: 'class-2',         name: '计科1班',         teacher: '张老师',         fullName: '软件工程学院-计算机科学技术-1班'       }, {         id: 'class-3',         name: '软工2班',         teacher: '李老师',         fullName: '软件工程学院-软件工程-2班'       }, {         id: 'class-4',         name: '工商1班',         teacher: '钱老师',         fullName: '商学院-工商管理-1班'       }]     },     fetchStudentClassMap() {       this.studentMap = {         'class-1': [           {             id: '20200101',             name: '小范',             age: 18           }, {             id: '20200102',             name: '小王',             age: 19           }, {             id: '20200103',             name: '小李',             age: 19           }         ],         'class-2': [           {             id: '20200201',             name: '小左',             age: 18           }, {             id: '20200202',             name: '小夏',             age: 19           }         ],         'class-3': [           {             id: '20200301',             name: '小丁',             age: 18           }, {             id: '20200302',             name: '小杨',             age: 19           }         ],         'class-4': [           {             id: '20200401',             name: '小许',             age: 18           }         ]       }     },     handleExpandChange(row, expandRows) {       const $classTable = this.$refs.classTable       console.log(row, expandRows);       if (expandRows.length > 1) {         expandRows.forEach(expandRow => {           if (row.id !== expandRow.id) {             $classTable.toggleRowExpansion(expandRow, false)          setTimeout(() => {         this.test = true         console.log('click', row);       });
          }         })       }       this.currentClassId = row.id       if(this.test) setTimeout(() => {         // this.test = true         console.log('click', row);       });       this.test = false     }   } } </script>
<style>     .demo-table-expand {         font-size: 0;     }
    .demo-table-expand label {         width: 90px;         color: #99a9bf;     }
    .demo-table-expand .el-form-item {         margin-right: 0;         margin-bottom: 0;         width: 50%;     } </style>

标签：el,name,age,class,scope,table,id,expand,row
来源： https://www.cnblogs.com/YuyuFishSmile/p/15971030.html