1

我有一个 v-for 中的可折叠列表和一个 QDataTable 组件，其中有多个选择，如下所示。

<q-collapsible :label="req.label" v-for="(req, index) in requisitions" :key="index" class="collapsible-no-padding requisitionContainer" @open="openRequisition('Requisition' + req.reqId)" @close="closeRequisition('Requisition' + req.reqId)" :id='"Requisition" + req.reqId'>
  <q-list>
    <q-item link class='ordersContainer'>
      <q-item-main>
        <q-data-table
          :data="req.filteredOrdersList"
          :config="orderConfigs"
          :columns="orderColumns"
          @selection="selectOrders">
        </q-data-table>
      </q-item-main>
    </q-item>
  </q-list>
</q-collapsible>

看起来像这样

在此处输入图像描述

但是，由于有多个表，如果在任何表上进行选择，它确实会使用所选项目调用选择方法，但我无法判断它是哪个表的一部分。当删除选择并将您返回一个空数组时，这是一个问题，我需要区分每个表选择事件。有没有办法做到这一点？

4

1 回答 1

1

您可以将对req对象的引用传递给@selection处理程序中的方法。

由于您还需要对当前隐式传递给selectOrder方法的选定项数组的引用，因此您现在需要显式传递该值。通常，您可以通过$event可访问的内联变量来做到这一点。

然而，与文档相反，<q-data-table>组件的selection事件发出两个变量：所选项目数组中元素的计数，以及所选项目本身的数组，按此顺序。

要获得对选定项目数组的引用，您需要访问通过以下方式发出的第二个参数arguments[1]：

@selection="selectOrders(arguments[1], req)"
于 2017-10-13T17:47:20.350 回答