Простой лес

Во многих приложениях используются данные, для представления которых необходимо несколько корневых узлов, поэтому скорректируем предыдущий пример так, чтобы он работал с лесом, а не с деревом, и можно было бы заметить различия между подходами. Для начала нам необходимы данные, имеющие несколько корневых узлов. Взгляните на следующий пример, где языки программирования перечислены в виде леса, полученного в результате исключения корневого узла «programming languages» (языки программирования):
{
identifier : 'name',
label : 'name',
items : [
{
name : 'Object-Oriented',
type : 'category',
children: [
{name : 'JavaScript', type : 'language'},
{name : 'Java', type : 'language'},
{name : 'Ruby', type : 'language'}
]
},
{
name : 'Imperative',
type : 'category',
children: [
{name : 'C', type : 'language'},
{name : 'FORTRAN', type : 'language'},
{name : 'BASIC', type : 'language'}
]
},
{
name : 'Functional',
type : 'category',
children: [
{name : 'Lisp', type : 'language'},
{name : 'Erlang', type : 'language'},
{name : 'Scheme', type : 'language'}
]
}
]
}


Как видите, в измененных данных, представленных в формате JSON, отсутствует единый корневой узел, поэтому такие данные можно представить только в виде леса. Единственное существенное изменение по сравнению с примером 15.7 заключается в необходимости добавления в диджит Tree параметра showRoot, чтобы скрыть его корень; в изменении запроса, чтобы идентифицировать узлы верхнего уровня, и в замене TreeStoreModel на ForestStoreModel. В примере 15.8 приводится измененный код разметки, в котором различия выделены жирным шрифтом.

Пример 15.8. Изменения, необходимые для представления данных не в виде дерева, а в виде леса
(body class="tundra")
<div dojoType="dojo.data.ItemFileReadStore" jsId="dataStore"
url="./programmingLanguages.json"></div>
<div dojoType="dijit.tree.ForestStoreModel" jsId="model" store="dataStore"
query="{type:'category'}"></div>
<div dojoType="dijit.Tree" model="model" showRoot=false></div>
(/body)


То, что данные имеют структуру, которую можно отобразить как лес, еще не означает, что их нельзя отобразить в виде дерева. В примере 15.9 демонстрируется, как в данных, получаемых с помощью механизмов dojo.data, можно сфабриковать корневой узел с помощью атрибутов rootId и rootLabel в ForestStoreModel.
Пример 15.9. Изменения, создающие корневой узел,
чтобы лес выглядел как дерево
(body class="tundra")
<div dojoType="dojo.data.ItemFileReadStore" jsId="dataStore"
url="./programmingLanguages.json"></div>
<div dojoType="dijit.tree.ForestStoreModel" jsId="model" store="dataStore"
query="{type:'category'}" rootId="root"
rootLabel="Programming Languages"></div>
<div dojoType="dijit.Tree" model="model" ></div>
(/body)


С практической точки зрения сфабрикованный корневой узел теперь может участвовать в операциях, выполняемых средствами интерфейса dojo.data, такими как getLabel и getValue. На первый взгляд в этом нет ничего особенного, но благодаря такому подходу теперь можно заниматься работой с данными, не отвлекаясь на необходимость обрабатывать особые случаи.
Теги:
Виджеты приложения
Добавлено: 25 Июля 2018 07:31:22 Добавил: Андрей Ковальчук Нравится 0
Добавить
Комментарии:
Нету комментариев для вывода...