When developing with Element UI and Vue, change the diaolog component in Element UI into its own component. Use the table component in Element UI in this component. I found that sometimes the rendering will be wrong. The reason is currently found. It's because of the radio button I added, but I don't know how to solve it. As shown in the picture below, please ask the master to answer your questions

<!--diaolog table-->

  <el-table :data="gridData" height="360" highlight-current-row style="width:100%" fit>
    <el-table-column label="" width="50">
      <template scope="scope">
        <el-radio :label="gridData[scope.$index].classId" v-model="radio" @change.native="getCurrentRow(scope.$index)"></el-radio>
      </template>
    </el-table-column>
    <el-table-column prop="className" label="班级名称" width="220"></el-table-column>
    <el-table-column prop="gradeSubject" label="年级/科目" width="150"></el-table-column>
    <el-table-column prop="teachingTime" label="授课时段" width=""></el-table-column>
    <el-table-column prop="teacher" label="任课老师" width="100"></el-table-column>
    <el-table-column prop="classTypeName" label="班型" width=""></el-table-column>
  </el-table>
  <!--分页-->
  <p class="page-box">
    <el-pagination layout="prev, pager, next" :page-count="pageTotal" :current-page="currentPage" @current-change="onChangePage"></el-pagination>
  </p>