记录element使用过程中的问题解决

问题1：el-table自动勾选失效问题

具体来说：第一次点弹出框，出现table并自动勾选上了数据；第二次点，全部勾选都不见了；第三次点，勾选又都出现了。如此往复。

仔细看代码，有this.$nextTick()，所以不存在渲染上的问题。并且每次打开都有执行到 this.$refs.multipleTable.toggleRowSelection(row); 这一步。

// 获取已经显示勾选的菜单
  this.$nextTick(()=>{
    if (checkedMenu) {
      checkedMenu.forEach(row => {
        this.$refs.multipleTable.toggleRowSelection(row);
      });
    } else {
      this.$refs.multipleTable.clearSelection();
    }
  })

最后想到，是 this.$refs.multipleTable.toggleRowSelection(row); 原因。每次打开勾选上，关闭对话框没有清除勾选，再次打开执行 toggleRowSelection 的时候，把勾选清除了。

所以要记得关闭对话框的时候，要加上this.$refs.multipleTable.clearSelection(); 清除勾选。

问题2：仍然是el-table自动勾选问题

具体来说：已经执行了this.$refs.multipleTable.toggleRowSelection(row);语句进行勾选，但页面上没有渲染出来。

通过debug发现，在vue 的 flushcallbacks执行过程中，页面table先勾选上了，然后勾又消失了。再细看，发现table的@selection-change 方法执行了两次。

解决： 加上代码  :reserve-selection="true" 和 :row-key="(row)=>{return row}"   

完整如下：

<el-table
   height="300px"
   :row-key="(row)=>{return row}"   
   ref="multipleTable"
   :data="bigPartTable.filter(data => !bigPartKey ||  
      data.toLowerCase().includes(bigPartKey.toLowerCase()))"
   style="width: 100%" @selection-change="handleSelectionChange">
 <el-table-column
   :reserve-selection="true"
   type="selection"
   width="55">
 </el-table-column>
...
</el-table>