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);
        }     
     }