我正在使用Tabulator 4.0.5。
要更新数据,我正在使用table.updateOrAddData(data)
。它工作正常,但有一个副作用-此方法 scroll top 整个表格。
由于某些单元格具有自定义工具提示(带有图片),因此我无法使用table.replaceData(data)
。 table.replaceData(data)
将创建新的节点,而我将必须创建新的工具提示。因此,每次数据替换时,工具提示都会重新出现。这种行为是不希望的。
是否可以在没有滚动顶部的情况下更新日期?也许有些骇客?
更新:
有一个简化的构造函数代码:
const table = new Tabulator('#selector', {
index: 'my_id',
selectable: true,
responsiveLayout: 'hide',
layout: 'fitColumns',
columns: [
{
field: 'thumbnail',
resizable: false,
cssClass: 'tooltip-container',
formatter: (cell) => {
let imgSrc = cell.getValue();
return (
`<div class="tool-tip tool-tip__center">
<img class="tool-tip__icon" src="${imgSrc}">
<p class="tool-tip__info">
<img src="${imgSrc}">
</p>
</div>`
);
},
headerSort: false,
},
// other columns
],
});
因此,在 formatter 中,我将创建将显示在单元格中的图像(类tool-tip__icon
)和将在悬停时显示的工具提示(.tool-tip:hover .tool-tip__info {display: block;}
)。
当我执行.replaceData(newData)
(可能很常见)时,工具提示会闪烁。由于该表正在使用新节点重新呈现。