vue+ element table如何给指定的单元格添加点击事件

                    <el-table 
                        class="table_info"
                        :data="tableData"
                        border
                        stripe
                        style="width: 100%"
                        :default-sort = "{prop: 'date', order: 'descending'}"
                        :row-style="tableRowStyle"
                        :header-cell-style="tableHeaderColor"
                        :cell-style="{padding:'2px'}"
                        >
                        <el-table-column
                          prop="documentName"
                          label="文件名称"
                          width="180"
                          align="center"
                          >
                          <template slot-scope="scope">
                            <el-link   @click="preview(scope.row)" v-if="scope.row.documentName==0"></el-link>
                            <el-link   @click="preview(scope.row)" v-else>{{scope.row.documentName}}</el-link>
                          </template>
                        </el-table-column>
					</el-table> 

js:

// 点击文件名称弹框
preview(row,id){
console.log(id,row);
this.show4=!this.show4;
this.show2=!this.show2;
},

<el-table-column prop="peoples_count" label="参与人数" align="center" width="150">
    <template slot-scope="scope">
        <el-button type="text" size="small" @click="handleJoinPeople(scope.row)" v-if="scope.row.peoples_count==0">管理参与人数</el-button>
        <el-button type="text" size="small" @click="handleJoinPeople(scope.row)" v-else>{{scope.row.peoples_count}}</el-button>
    </template>
</el-table-column>
<el-table-column prop="yxcard_count" label="办卡人数" align="center" width="150" >
    <template slot-scope="scope">
        <el-button type="text" size="small" @click="handleCard(scope.row)" v-if="scope.row.yxcard_count==0">管理办卡人数</el-button>
        <el-button type="text" size="small" @click="handleCard(scope.row)" v-else>{{scope.row.yxcard_count}}</el-button>
    </template>
</el-table-column>
<el-table-column prop="goods_count" label="活动兑换商品" align="center" width="150" >
    <template slot-scope="scope">
        <el-button type="text" size="small" @click="handleGoods(scope.row)" v-if="scope.row.goods_count==0">管理活动商品</el-button>
        <el-button type="text" size="small" @click="handleGoods(scope.row)" v-else>{{scope.row.goods_count}}</el-button>
    </template>
</el-table-column>
<el-table-column prop="order_count" align="center" label="商品订单" >
    <template slot-scope="scope">
        <el-button type="text" size="small" @click="handleOrder(scope.row)" v-if="scope.row.order_count==0">管理订单</el-button>
        <el-button type="text" size="small" @click="handleOrder(scope.row)" v-else>{{scope.row.order_count}}</el-button>
    </template>
</el-table-column>

 handleJoinPeople(row,id){
        console.log(row.ac_id);
        
    },
    handleCard(row,id){
        console.log(row.ac_id);
    },