使用 Column 元属性悬停 Buefy 表格单元格？答案

【问题标题】：Hover for Buefy table cell using Column meta property?使用 Column 元属性悬停 Buefy 表格单元格？
【发布时间】：2019-05-14 16:01:34
【问题描述】：

我有一个 Buefy 表，它没有 b-table-columns 并使用 :data 和 :columns 填充 json 数据点。我需要使用@onhover 来显示单元格表的其他数据点。

我知道我可以将tooltip-b 用于b-table-column，如下面的代码：

<b-table-column field="id" label="ID" width="40" sortable numeric>
    <b-tooltip label="Some additional info about the status" position="is-right">
        <span class="tag is-success is-status is-small">{{ props.row.id }}</span>
    </b-tooltip>
</b-table-column>

但我正在寻找不必使用b-table-column 的东西，因为我必须用b-table-columns 重写我的整个表。

我注意到一个元属性可以包含 buefy 表列中的任何内容。

我应该使用:meta="function(cellIndex)" 之类的东西吗？

【问题讨论】：

标签： javascript vue.js buefy

【解决方案1】：

所以我最终用b-table-column 重写了表格列，下面是我的工作代码：

          <b-table-column field="bidCondition" label="B.Cond" sortable numeric centered width="40">
            <b-tooltip :label="tooltipLable(props.row.bidCondition)" position="is-top">
              <span class="dashed-underline">{{ props.row.bidCondition }}</span>
            </b-tooltip>
          </b-table-column>

【讨论】：