Question

我有一个Tabulator.js表。该表是使用TreeTree的dataTree选项。行在列“ id”中具有唯一的ID。

scrollToRow()函数引发以下错误：

未处理的拒绝滚动错误-找不到匹配的行

table = new Tabulator("#cutover_plan_table_container", {
            height:"500px",
            headerSort: false,
            data:hierarchical_cutover_obj,
            dataTree:true,
            dataTreeStartExpanded:true,
            dataTreeElementColumn:"name",
            dataTreeChildField:"outlineChildren",
            dataTreeBranchElement:false,
            dataTreeChildIndent:17,
            scrollToRowPosition: "center",
            index:"id", 
            virtualDom: true,
            virtualDomBuffer : true,
    
            columns:[
                {title:"", field:"id", align:"center",cssClass:"cutover_column_id"},
                {title:"UID", field:"uid"},
                {title:"Name", field:"name", responsive:0},
                {title:"Predecessor", field: "predecessor", width:150,formatter:function(cell, formatterParams, onRendered){
                    return '<a href="javascript:goToTableRow(' + cell.getValue() + ');">' + cell.getValue()+ '</a>, ';
                }}
            ]
    }); 
    
    
function goToTableRow(targetRow){
        table.scrollToRow(targetRow, "center", true);
}

如果单击 Predecessor 单元格值，则会在控制台上收到未处理的拒绝滚动错误-未找到匹配行错误。如果不是树（dataTree： false ），则滚动就像超级按钮一样工作。

Answer 1

首先，与您的原始问题略有不同，这是触发滚动的一种非常不好的方法，您可以使用 cellClick 回调，然后再不需要自定义格式器或函数：

{title:"Predecessor", field: "predecessor", width:150, cellClick:function(e, cell){
    table.scrollToRow(cell.getValue(), "center", true);
}}

其次，由于无法通过ID定位子行，因此查询仅在顶级数据上起作用。

如果您正在尝试滚动到父行，则可以在行组件上使用 getTreeParent 函数并调用 scrollTo 直接在其上起作用。

{title:"Predecessor", field: "predecessor", width:150, cellClick:function(e, cell){
    var parent = cell.getTreeParent();

    if(parent){
        parent.scrollTo();
    }
}}

tabulator.js-scrollToRow（）在树上不起作用？

1 个答案: