Сегодня я попытался использовать Grouped DetailsList из fluent-ui.
Что я ожидал: Мне нужно объявить несколько групп, скажем, красный, синий, зеленый, а затем просто добавить к каждому элементу, я хочу добавить в список, конкретное c свойство, которое отображает элемент в группы. например:
groups: [
{ key: 'red', name: 'Color: "red"'},
{ key: 'green', name: 'Color: "green"'},
{ key: 'blue', name: 'Color: "blue"' },
],
items: [...,
{ key: 'red',anyProp1: "abc", anyProp2: "dfg",...},
...,
]
Что я выяснил, я должен сделать: Мне нужно отсортировать массив, который содержит мои элементы таким образом, чтобы все элементы, принадлежащие группе, были красным быть в одном блоке. например: [красный, красный, красный, синий, синий, зеленый, зеленый, зеленый]. Теперь мне нужно было предоставить информацию о startIndex и счетчике, чтобы сопоставить мой массив элементов с группами.
Вот как могло бы выглядеть определение группы:
groups: [
{ key: 'groupred0', name: 'Color: "red"', startIndex: 0, count: 2, level: 0 },
{ key: 'groupgreen2', name: 'Color: "green"', startIndex: 2, count: 0, level: 0 },
{ key: 'groupblue2', name: 'Color: "blue"', startIndex: 2, count: 3, level: 0 },
],
Я могу Не понимаю, почему так сделали (мне так неудобно). Итак, пока я больше между новичком и промежуточным звеном в JS. Думаю, ребята, которые это реализовали, - профессионалы. Должна быть причина. Может это как-то связано с производительностью? Я мог представить, что когда дело доходит до очень больших списков, это работает лучше, но я не уверен.
Кто-нибудь знает подробности об этом и может объяснить?