Подтвердить что ты не робот

SlickGrid, что такое представление данных?

Я начал использовать SlickGrid, и я запутался в различии между Data View и Grid (с включенным редактированием). Я не нашел в документах некоторого обсуждения представления данных, хотя там уже упоминалось.

Пожалуйста, просветите меня.

4b9b3361

Ответ 1

В очень простых терминах просто подумайте о трех слоях:

  Grid
  ----
DataView
  ----
  Data

Внизу у вас есть необработанные данные. Это просто простой массив. Каждый элемент массива представляет одну строку данных (для отображения в виде одной строки в сетке).

DataView считывает массив данных и делает его доступным для сетки, выставляя несколько стандартных методов. Таким образом, когда сетка хочет получить данные для отображения, она просто говорит с dataview через один из стандартных методов.

Сетка представляет собой компонент отображения. Его единственная ответственность - отобразить HTML-код, необходимый для отображения желаемого вывода на экране.

Сетка никогда не обращается к данным напрямую. Он всегда разговаривает с данными. Это позволяет dataview выполнять трюки при возврате данных в сетку, например, доставку строк phantom, используемых для представления заголовков групп.

Если вам интересно, приведенный ниже пример - это самый простой пример, который вы можете использовать, используя dataview с SlickGrid.

var data = [
  { title: "Primer",       rating: "A" },
  { title: "Matrix",       rating: "B" },
  { title: "Transformers", rating: "C" },
];
var columns = [
  { id: "title",  name: "Title",  field: "title" },
  { id: "rating", name: "Rating", field: "rating" }
];
var options = {
  enableColumnReorder: false  // ... whatever grid options you need
};

var dataView = new Slick.Data.DataView();
var grid = new Slick.Grid("#myGrid", dataView, columns, options);

// wire up model events to drive the grid
dataView.onRowCountChanged.subscribe(function (e, args) {
  grid.updateRowCount();
  grid.render();
});
dataView.onRowsChanged.subscribe(function (e, args) {
  grid.invalidateRows(args.rows);
  grid.render();
});

// Feed the data into the dataview
dataView.setItems(data);

Ответ 2

DataView - это абстракция поверх вашего источника данных. Если все данные доступны на клиенте (т.е. В массиве Javascript), DataView может предоставить множество полезных функций, которые сама сетка не имеет. (Тот факт, что сетка не обладает этими функциями, - по дизайну - SlickGrid старается поддерживать ядро ​​и простоту, одновременно поощряя модульный дизайн и абстракцию данных в своем API.)

DataView работает, беря ваши данные и действуя как поставщик данных, которые вы можете передать SlickGrid вместо исходного массива данных. Например, если вы делаете данные группы DataView, это заставляет сетку думать, что строки "группы" являются просто регулярными элементами данных, поэтому сетка не нуждается в них. DataView сообщает сетке, что эти элементы имеют настраиваемый дисплей и поведение и обеспечивают реализацию обоих. Затем вы подключаете события DataView onRowCountChanged и onRowsChanged для обновления сетки и voila.

Вот приблизительный список функций, которые DataView добавляет в сетку:

  • пейджинга.
  • Сортировка.
  • Поиск.
  • Группировка с итогами.
  • Развернуть/свернуть группы.

Ответ 3

DataView позволяет сортировать и фильтровать данные без изменения его или сетки. Вы можете думать об этом как оверлей сверху на сетке, которая предоставляет связанные с просмотром функции - в некоторых случаях улучшает эти функции.

Надеюсь, что это поможет!