elementUI，多選表格實現單選操作

<el-table
        ref="multipleTable"
        :data="tableData"
        tooltip-effect="dark"
        style="width: 100%"
        height="53vh"
        @row-click="toStaffDetail"
        @select="userChoose"
      >
        <el-table-column type="selection"></el-table-column>
        <!-- 循環展示表頭 -->
        <template v-for="(col) in tableHeaderData">
          <el-table-column
            :prop="col.dataProp"
            :label="col.dataName"
            :key="col.dataProp"
          ></el-table-column>
        </template>
      </el-table>
     <script>
		userChoose(selection, row) {
         //clearSelection：用於多選表格，清空用戶的選擇
         //此時所有的checkbox處於未勾選，當用戶第一次點擊的時候，selectio爲一個數組，裏面存放的爲當前這一行的數據
         this.$refs.multipleTable.clearSelection();
         //此時selection仍然有值 ，只是勾選狀態不顯示了。
	      if (selection.length === 0) {
	        return;
	      }
	      //這這裏將這行的狀態又變爲了勾選
	      this.$refs.multipleTable.toggleRowSelection(row, true);
	      //用於多選表格，切換某一行的選中狀態，如果使用了第二個參數，則是設置這一行選中與否（selected 爲 true 則選中）
    },
    </script>

上面爲簡單的代碼展示，我們想要實現，elementUI中多選表格中實現單選，這種一般都是基於Api進行的一些操作，查詢API我們可以知道：

在Table Events中有一個select事件：當用戶手動勾選數據行的 Checkbox 時觸發的事件，該函數節接受兩個參數selection，row`,基於這個函數我們再借助別的API就可以實現我們想要的效果了

由於對於elementUI的API不夠熟練，在開發過程中遇到了很多的問題，相信隨着實踐經驗的積累，自己在項目中也會越來越熟練。