Дерево dgrid 0.4.0 выглядит плоским до взаимодействия с пользователем

Пытаюсь использовать dgrid 0.4.0 для отображения древовидной структуры. (нет опыта работы с предыдущими версиями 0.3.x).

Я создал этот образец с двумя папками: alice и bob; в каждом будет несколько файлов (листьев).

Магазин ("astore.js")

define(['dojo/_base/declare',
       './dstore/Memory',
       './dstore/Tree'],

       function(declare, Memory, Tree) {
           var store = new (declare([Memory, Tree], {}))();

           store.add({node:'bob',     id:1, parent:null, hasChildren:true});
           store.add({node:'alice',   id:2, parent:null, hasChildren:true});

           store.add({node:'thesis',  id:3, parent:1,    hasChildren:false});
           store.add({node:'game',    id:4, parent:1,    hasChildren:false});
           store.add({node:'picture', id:5, parent:2,    hasChildren:false});
           store.add({node:'plan',    id:6, parent:2,    hasChildren:false});
           store.add({node:'mail',    id:7, parent:2,    hasChildren:false});

           return store;
       });

И скрипт запуска:

require(['dojo/_base/declare',
        'app/dgrid/OnDemandGrid',
        'app/dgrid/Tree',
        'app/astore'], 
        function (declare, OnDemandGrid, Tree, astore) {

            w = new (declare([OnDemandGrid, Tree],{}))({
                collection: astore,
                columns:[
                    {field:'node', label:'Whatever...', renderExpando:true}
                ]
            }, 'slot');

            w.startup();
        });

Данные всегда выглядят плоскими при отображении виджета:

введите здесь описание изображения

После того, как я нажму на «боб», эта часть разбирается:

введите здесь описание изображения

Затем я нажимаю «Алиса», и, наконец, все выглядит нормально:

введите здесь описание изображения

Однако, если я сортирую по столбцу, я снова все испорчу, хуже, чем когда-либо:

введите здесь описание изображения

Я экспериментировал с образцом кода из лаборатории и получил те же результаты. Мои компоненты dgrid были загружены через Bower. Эта проблема присутствует на двух разных компьютерах с разными ОС и браузерами. И у меня иссякают идеи... :S Любой вклад чрезвычайно ценен!


person Mathias Dolidon    schedule 05.03.2015    source источник


Ответы (1)


Как отметили Дилан и я в проблеме github с тем же вопросом, вам нужно пройти коллекция в вашей сетке, которая представляет только элементы верхнего уровня. При использовании dstore/Tree для этой цели можно вызвать store.getRootCollection().

Итак, вместо collection: astore вам нужно collection: astore.getRootCollection().

person Ken Franqueiro    schedule 06.03.2015
comment
Привет Кен. Да, извините за кросспостинг, я сначала подумал не о том месте. Когда я передал .getRootCollection, все, что я получил, было деревом с только корневыми элементами. Однако это было с моей собственной реализацией модели дерева, прежде чем перейти к миксину хранилища дерева со стандартными именами свойств parent/id/hasChildren. Я предполагаю, что две проблемы перепутались. Благодарю за разъяснение ! - person Mathias Dolidon; 06.03.2015
comment
Если бы мне пришлось поставить на дикую догадку, возможно, ваша первоначальная реализация не имела общего root, ссылающегося на исходный магазин, на который ссылались и getRootCollection, и getChildren для своей работы, поэтому getChildren в конечном итоге попытался захватить дочерние элементы из уже отфильтрованного хранилища только для родителей. коллекция. dstore/Tree в основном представляет собой 4 реализации однострочного метода, поэтому его легко использовать в качестве базовой или эталонной реализации. - person Ken Franqueiro; 06.03.2015
comment
Это точно. Я не считал необходимостью фактического частного корневого элемента. Это самая полезная информация, которую я получил сегодня. В долгу перед вами! - person Mathias Dolidon; 06.03.2015