element-UI中table表格的@row-click事件和@selection-change耦合了

<el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" style="width: 100%" @row-click="openDetails" @selection-change="handleSelectionChange">
    <el-table-column type="selection" width="38"></el-table-column>
    <el-table-column label="訂單編號" width="170" fixed>
      <template scope="scope">{{ scope.row.orderNo }}</template>
    </el-table-column>
    <el-table-column prop="payNo" label="支付單號" width="170"></el-table-column>
    <el-table-column prop="wName" label="商戶公衆號名稱" width="130"></el-table-column>
    <el-table-column prop="wID" label="商戶公衆號ID" width="120"></el-table-column>
    <el-table-column prop="payer" label="支付人" width="120"></el-table-column>
    <el-table-column prop="payment" label="支付方式" width="100"></el-table-column>
    <el-table-column prop="business" label="所屬業務" width="100" show-overflow-tooltip></el-table-column>
    <el-table-column prop="amount" label="支付金額" width="120" class-name="sum-color"></el-table-column>
    <el-table-column prop="fee" label="手續費" width="120" class-name="sum-color"></el-table-column>
    <el-table-column prop="refund" label="退款金額" width="120" class-name="sum-color"></el-table-column>
    <el-table-column prop="actual" label="實際金額" width="120" class-name="sum-color"></el-table-column>
    <el-table-column prop="status" label="到帳狀態" width="100"></el-table-column>
    <el-table-column prop="payDate" label="支付時間" width="150"></el-table-column>
    <el-table-column prop="arrivalDate" label="到帳時間" width="150"></el-table-column>
</el-table>

注意@row-click和@selection-change

export default { data () { return { tableData: [ { id: 123, orderNo: '6881234567890123456', payNo: '2331234567890123456', wName: 'xxx公衆號', wID: 'zjfiawsf', payer: '張三張四張五', payment: '微信支付', business: '微餐飲', amount: '14614.00', // 支付金額 fee: '322.00', // 手續費 refund: '322.00', // 退款金額 actual: '322.00', // 實際金額 status: '已到帳', // 到帳狀態 payDate: '2017-9-27 10:31:37', // 支付時間 arrivalDate: '2017-9-27 10:31:44', // 到帳日期 } ], multipleSelection: [], } }, watch: { multipleSelection: function () { let arr = []; for (let i in this.multipleSelection) { arr.push(this.multipleSelection[i].id); } console.log('勾中的id爲：' + arr.join()); } }, methods: { //打開詳情頁彈窗 openDetails(row) { alert(row.id); }, // 獲取多選參數 handleSelectionChange(val) { this.multipleSelection = val; }, } }

checkbox勾選的時候，alert會被觸發兩次。我猜想是@row-click和@selection-change耦合了，可是element-UI的文檔很簡潔，不知道@row-click和@selection-change怎麼解耦。
正常效果應該是點擊一行數據alert出數據的id,點擊checkbox把id存起來。

解決方法：

openDetails(row,event,column) { if(event.target.nodeName!="INPUT"){ alert(row.id); } }