Получить отрендеренные строки в `treepanel` Ext JS

Мне нужен способ получить все визуализированные строки в treepanel, но я не смог найти, как этого добиться.

Я попробовал следующие события:

  • treepanel#render: panel.getNodes() пусто, потому что строки отображаются после панели.
  • treeview#refresh: он вызывается позже, и view.up('panel').getNodes() успешно возвращает строки

Но это не учитывает строки, добавленные позже путем расширения узлов.

  • treeview#cellclick: это может почти работать вместе с treeview#refresh, но это не учитывается программно .expand() узел
  • treepanel#itemexpand: дает доступ к расширенному узлу и строке HTMLElement, но мне нужны дети, которые оказываются

Я также попробовал renderer в

xtype: 'treepanel',
columns: {
    xtype: 'treecolumn',
    renderer: function (...)

Это лучший кандидат в том смысле, что он вызывается ровно один раз для каждой отображаемой строки, но проблема в том, что он вызывается до того, как будет отображена строка, поэтому нет способа получить из нее ссылку на отображаемую строку.

Та же проблема относится к gridpanelНо там все еще сложнее. Среди других проблем я не смог найти событие, которое срабатывает, когда bufferedRenderer отображает новые страницы магазина.

1 ответ

Решение

Я не смог найти решение, используя противоречивые события ExtJs.

К счастью, в vanilla JS есть возможность получить узлы, которые вставляются в DOM: MutationObserver, Вот что я придумал:

Ext.define('Mb.Application', {
    ...
    launch: function() {
        const body = document.getElementsByTagName('body')[0],
            config = { childList: true, subtree: true },
            callback = function(mutationsList) {
                mutationsList.forEach(mutation => {
                    if (mutation.type !== 'childList') return
                    if (!mutation.addedNodes.length) return
                    mutation.addedNodes.forEach(node => {
                        // test if it is a row and do what I need
                    })
                })
            };
        var observer = new MutationObserver(callback.bind(this));
        observer.observe(body, config);

Я не знаю, какое влияние это может оказать на производительность. В моем случае не было ничего заметного.

Я не знаю, поможет ли это кому-нибудь, но на всякий случай я поделюсь этим...

Другие вопросы по тегам