Я использую Tabulator v4.6.2 в моем приложении Vue. Я хочу показать всплывающее окно при наведении курсора на определенный столбец ячейки.
Разметка:
<div class="tabulator" ref="table"></div>
Сценарий:
this.tabulator = new Tabulator(this.$refs.table, {
layout: "fitDataFill",
virtualDom: false,
data: [{ "notes": "Lorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs", "_id": 111 },
{ "notes": " The passage is attributed to an unknown typesetter in the 15th century who is thought to have scrambled parts of Cicero's De Finibus Bonorum et Malorum for use in a type specimen book.", "_id": 222 }],
columns: [{
title: "Notes",
field: "notes",
formatter: function (e, cell) {
let data = cell.getValue();
return `
<i
class="fa fa-sticky-note-o"
:id="'notes'+data._id"
aria-hidden="true"
></i>
<b-popover
:target="'notes'+data._id"
triggers="hover"
placement="left"
custom-class="pop-over-custom"
>
<div class="my-2">{{data.notes}}</div>
</b-popover>`;
}
}]
})