使用服务器端数据表时如何在前端vue.js中添加操作按钮？

这是我到目前为止的内容，此代码有效，但是单击操作按钮不会发出请求。 （警报也不会触发）。显示操作按钮并调用editTaxGroup（）

$(document).ready(function() {
            let tax = 1;
            self.dataTable = $("#tax_groups2").DataTable({
                serverSide: true,ajax: {
                    "columns": [
                        { "data": "tax_group_name" },{ "data": "country.country_name" },{ "data": "tax_rate_percentage" },{ "data": "Edit" },{ "data": "Delete" }
                    ],data: {
                        "token": localStorage.getItem("token"),},url: 'api/v1/get-tax-groups',dataFilter: function(data){
                        var json = jQuery.parseJSON( data );
                        json.recordsTotal = 100;
                        json.recordsFiltered = 100;
                        self.tax_groups = data.data;
                        return JSON.stringify( json ); // return JSON string
                    }
                },columns: [
                    {data: "tax_group_name"},{data: "country.country_name",{data: "tax_rate_percentage"},{data: "Edit"},{data: "Delete"},],"columnDefs": [
                    {
                        "targets": [ -2 ],"data":"id","defaultContent" : '<a href="#"   id="edit" data-tax="'+tax+'" class="btn btn-outline-warning m-btn m-btn--icon m-btn--icon-only m-btn--pill fd-edit-btn"><i class="fas fa-pen"></i></a>'
                    },{
                        "targets": [ -1 ],"defaultContent" : '<a href="#" class="btn btn-outline-danger m-btn m-btn--icon m-btn--icon-only m-btn--pill fd-delete-btn" @click=deletetaxGroup(tax_group)><i class="fas fa-trash"></i></a>'
                    }
                ],});
        })
        $('#tax_groups2 tbody ').on('click','#edit',function () {
            for (let key in self.tax_groups){
                alert(1)
                console.log(key);
                if(self.tax_groups.hasOwnProperty(key)){
                    console.log(`${self.tax_groups[key]}`)
                }
           }

        } );
    });
},