vue.js实现表格行删除

有时候我们在使用ajax删除数据后，要动态的更新表格的数据，使用jquery删除dom节点倒是可以很容易。使用vue其实也方便，因为vue是双向绑定所以我们删除数据源即可，页面会自动刷新的。

首先绑定事件：

<a class="del" data-id=".id9" @@click="deleteService(item.ServiceID,index)">删除</a>

这里传了一个index就是循环的索引，这样我才好在事件中去删除数据源。还有这里之所以是两个@因为.net mvc中@本身有他自己的含义

然后在事件中去删除数据源即可

   var consulserviceVue = new Vue({
        el: "#cons",
        data: {
            cons: {},
            instances: []
        },
        created: function () {
        },
        updated: function () {
        },
        methods: {
            deleteService: function (serviceId, index) {
                if (confirm("确定删除嘛?")) {
                     //..............你的删除逻辑
                     alert("删除成功!");
                     //把数据源中对应的数据行删除即可
                     consulserviceVue.$data.instances.splice(index, 1);
                }
            }
        }
    });