Element-ui 多层表头，自定义排序事件

1. el-table 中加入 @sort-change=“handleSort” 事件
2. 需要自定义排序的表头中加入 :prop=“${item.subjectId}.score”（根据实际需求），以及 sortable

// 前端代码
<el-table
	v-loading="isLoading"
	:cell-style="{
	  'text-align': 'center',
	  'font-size': '12px',
	  color: '#000',
	  padding: '5px',
	}"
	:header-cell-style="{
	  padding: '5px 0',
	  'font-size': '12px',
	  'background-color': '#f5f7fa',
	  color: '#909399',
	  'text-align': 'center',
	}"
	:data="tableData"
	****@sort-change="handleSort"****
	style="width: 100%"
	>
	<el-table-column prop="name" label="姓名" fixed="left">
	</el-table-column>
	<el-table-column prop="kaohao" label="考号" fixed="left">
	</el-table-column>
	<el-table-column prop="xuehao" label="学号" fixed="left">
	</el-table-column>
	<el-table-column prop="banji" label="班级" fixed="left">
	</el-table-column>
	
	<template v-for="(item, index) in subjects">
	  {{ item.name }}
	  <el-table-column :label="item.name" :key="item.subjectId">
	    <el-table-column width="90" label="分数" :prop="`${item.subjectId}.score`" sortable>
	      <template slot-scope="scope">
	        {{ scope.row.subjects[index].score }}
	      </template>
	    </el-table-column>
	    <el-table-column width="100" label="学校排名" :prop="`${item.subjectId}.gradeRank`" sortable>
	      <template slot-scope="scope">
	        <span>{{ scope.row.subjects[index].gradeRank }}</span>
	      </template>
	    </el-table-column>
	    <el-table-column width="100" label="班级排名" :prop="`${item.subjectId}.classRank`" sortable>
	      <template slot-scope="scope">
	        {{ scope.row.subjects[index].classRank }}
	      </template>
	    </el-table-column>
	  </el-table-column>
	</template>
	</el-table>

// JS代码
data() {
  return {
    subjects: [
     {name: '总分', subjectId: '1'},
     {name: '语文', subjectId: '2'},
   ],
  };
},
methods:{
	handleSort(val) {
	  // 获取一级表头的数据
      const prop = val.prop.split('.');
      const order = {
        pindex: prop[0],
        key: prop[1],
        rule: val.order === 'ascending' ? 'asc' : 'desc'
      }
    },
}