javascript - bootstrap-vue 表 Action onclick

Question

我在 Vue.js 中有一个包含数据的表格，我想在最后一个单元格中添加一些“点击操作”。

About boostrap-table

这是我的表格模板:

<BootstrapTable :columns="table.columns" :data="table.data" :options="table.options"  v-if="table.ready">

和数据:

this.table = {
   ready: false,
   columns: [
               {
                field: 'id',
                title: 'id',
                visible: true
               },
                {
                field: 'test',
                title: 'test',
                visible: true,
                formatter: addClicks(this)
               },
               ...
  ]}

[编辑]

我想要这样的东西，但显然，这没有被渲染:

...
formatter: function (value, row) {
   const ve = "<span @click='setElement("+row.id+")' class='btn btn-success btn-sm'>Set</span>";
   return ve;
}

我应该怎么做才能在点击时执行操作？

Answer 1

您可以从 bootstrap-vue 表触发 OnClickCell 事件

事件:onClickCell jQuery 事件:click-cell.bs.table

参数:字段、值、行、$element

详细信息:

当用户点击单元格时触发，参数包含:

field:被点击的单元格对应的字段名。 value:被点击的单元格对应的数据值。 row:点击行对应的记录。 $element: td 元素。