b-table 单元格点击事件丢失答案

【问题标题】：b-table cell cliked event missingb-table 单元格点击事件丢失
【发布时间】：2022-12-17 11:24:58
【问题描述】：

我必须将单元格值传递给单击单元格的函数。它可以在好的桌子上轻松完成，但我试图找到在 bootstrap-vue b-table 上完成它的方法。

桌子：

<b-table
    striped
    responsive
    class="mb-0"
    :items="permissionsData"
  >
    <template #cell(module)="data">
      {{ data.value }}
    </template>
    <template
      #cell()="data"
    >
      <b-form-checkbox
        :checked="data.value"
      />
    </template>
  </b-table>

和方法：

methods: {
    onPermissionClick(value) {
        console.log("column name, row name and the value")
    }
},

有谁知道如何做到这一点的好方法吗？

【问题讨论】：

标签： vue.js bootstrap-vue

【解决方案1】：

<b-table
    striped
    responsive
    class="mb-0"
    :items="permissionsData"
  >
    <template #cell(module)="data">
       <div @click="onPermissionClick">
            {{ data.value }}
       </div>
    </template>
  </b-table>

您将获得数据中的所有属性。但在这里我根据你的问题提到单元格、行和列。您可以通过 console.log(data) 看到的其他属性

methods: {
    onPermissionClick(data) {
       console.log(data.value)   // cell value
        console.log(data.item)   // row
        console.log(data.field) // column
    }
},

【讨论】：