如何用vuejs中的新数据刷新数据表？

Question

我1.10.19在 vue js 中使用数据表。在这里，我有一个动态表格，点击某个按钮，它过滤并用新数据替换表格到表格的 tr 标签。如何用新内容刷新表格？我用过clear，destroy但没有任何效果。这是我的整个代码。

代码链接

Answer 1

像这样更新您的代码，它应该可以工作

$('.reportDataTableModelWise').DataTable().destroy();

在调用数据之前 this.$store.commit('modelWiseTabularReport');

并像这样更新您更新的代码

this.$nextTick(function() {
        $('.reportDataTableModelWise').DataTable({
            'destroy'     : true,
            'paging'      : true,
            'lengthChange': true,
            'searching'   : true,
            'ordering'    : true,
            'order'       : [[ 5, 'desc' ]],
            'info'        : true,
            'autoWidth'   : false,
            'dom'         : 'Blfrtip',
            'buttons'     : [
                {
                    'extend': 'csv',
                    'title': this.$route.meta.report_name + ' Report'
                },
                {
                    'extend': 'pdf',
                    'title': this.$route.meta.report_name + ' Report'
                },
                {
                    'extend': 'print',
                    'title': this.$route.meta.report_name + ' Report'
                }
            ]
        });
    });

在$nextTick既要保证Vue公司已经刷新了新的数据到DOM，重新初始化之前。