获取 Quasar 上的当前 ID Table

Question

早上好，

我正在尝试在 Quasar table 中制作和编辑功能。它按预期工作，但是当我在 table 中有多个条目时，它默认为最后一个条目。

使用道具将行的值添加到组件中，我的问题是获取当前行。所以我的问题是单击按钮时如何获得正确的行？

Answer 1

您可以使用props.row获取行数据。

示例 -

<q-table
          title="Treats"
          :data="data"
          :columns="columns"
          row-key="name"
        >
          <template v-slot:body-cell-name="props">
            <q-td :props="props">
              <div>
                <q-badge color="purple" :label="props.value"></q-badge>
                <q-btn icon="edit" dense flat size="sm" @click="EditData(props.row)"></q-btn>
              </div>

            </q-td>
          </template>
        </q-table>


  methods:{
    EditData(row){
      alert("hi")
      console.log(row);
      console.log(this.data.indexOf(row))
    }
  }

现在你有一行和 indexof 特定行。您可以使用 splice 或替换特定索引上的元素。

Codepen - https://codepen.io/Pratik__007/pen/LYVjqXb

检查控制台。

Answer 2

**您可以使用索引获取行号

      <tr v-for="(strockorder,index) in strockorders" :key="index">
      <td class="text-left">{{ strockorder.strockNo}}</td>
      <td class="text-center">{{ strockorder.item}}</td>
      <td class="text-center">{{ strockorder.orderDate}} </td>
      <td class="text-center">{{strockorder.deliveryDate }}</td>

**

获取 Quasar 上的当前 ID Table

Getting Current ID on Quasar Table

vue.js

quasar