Question

我正在Laravel项目中使用称为vue-good-table（https://xaksis.github.io/vue-good-table/）的Vue组件。我只需要能够使用该组件提供的分页来选择表中的所有记录。该组件提供了SelectAll功能，但是问题在于它仅适用于每个页面。您可以选择实际页面的所有行，但不能选择整个表中的所有行，如以下gif所示：

selectAll example

是否可以使用selectAll按钮选择所有表行或类似内容？

谢谢！

Answer 1

添加到您的表@on-select-all="selectAll" 所以它看起来像：

<vue-good-table
    @on-select-all="selectAll"    
    :columns="columns"
    :rows="rows"
    :select-options="{ enabled: true }">
</vue-good-table>

并创建新方法

selectAll(){
      this.row.forEach(item=>{
        if(item.vgtSelected){
          this.$set(item,'vgtSelected', false);
        }else{
          this.$set(item,'vgtSelected', true);
        }
      },this);
    }

这应该可以解决您的问题

在vue-good-table Vue组件中选择所有表行（不仅按页面）

1 个答案: