Элементы списка табуляторов исчезают при прокрутке;проблема virtualDomBuffer? - PullRequest
0 голосов
/ 19 ноября 2018

Tabulator v3.5.3
Настольное приложение Electron (OSX и ПК)

При более чем 300 элементах Tabulator демонстрирует странное поведение;самое серьезное, что предметы исчезают.Другие симптомы включают размер «большого пальца» и положение прокрутки, которое становится ошибочным и непоследовательным (например, положение большого пальца не отражает положение прокрутки в общем списке).

Мне интересно, установил ли virtualDomBuffer слишком высокий или слишком низкий,Поведение происходит, когда оно установлено на 300. Только 13-15 элементов будут отображаться на экране одновременно.Я устанавливаю высоту экземпляра Tabulator следующим образом: height: "84vh".Это правильное значение CSS, которое может обрабатывать Tabulator?

Я пытался установить virtualDomBuffer в 1000, но, возможно, это неправильный способ справиться с этим?

(я знаю, что естьболее новая версия Tabulator, но мне нужна поддержка и существующее приложение, и я не хочу вносить большие изменения, если мне не нужно.

enter image description here - - - - enter image description here


Инициализация экземпляра табулятора

  eventList = $("#event-list");
        eventList.tabulator({
            height: "84vh",
            virtualDomBuffer: 300,
            layout: "fitColumns",
            resizableColumns: false,
            selectable: 1,
            responsiveLayout: "hide",
            placeholder: "No Events",
            columns: [
                {
                    title: "Events",
                    field: "startDate",
                    formatter: eventListRowFormatter,
                    variableHeight: true,
                    headerSort: false
                },
                { formatter: deleteIcon, width: 5, align: "center", cellClick: deleteFromEventList }
            ],
            rowClick: function (e, row) {
                // prevent deselecting clicked row
                var selectedRows = eventList.tabulator("getSelectedRows");
                if (selectedRows.length == 0) {
                    eventList.tabulator("selectRow", row);
                } else if (isEventDirty == false) {
                    lastEventSelected = row;
                    setActiveEvent(row.row.data)
                } else {
                    eventList.tabulator("deselectRow");
                    eventList.tabulator("selectRow", lastEventSelected);
                }
            },
            rowDeselected: function (row) {
                if (isEventDirty == true) {
                    lastEventSelected = row;
                }
            },
            ajaxLoader: false
        });

Форматирование столбцов

function eventListRowFormatter(cell) {
    var data = cell.cell.row.data

    if (data.eventTitle == "") {
        return " - " + "<br>" + "<small>" + data.startDate + "</small>"
    } else {

        return data.eventTitle + "<br>" + "<small>" + data.startDate + "</small>"
    }
}

1 Ответ

0 голосов
/ 23 ноября 2018

В версии 3.5 были некоторые проблемы с рендерингом, я бы предложил обновить до версии 4.1

...