Пользовательские заголовки Office Fabric UI - PullRequest
Новая
       11

Пользовательские заголовки Office Fabric UI

0 голосов
/ 18 января 2019

Я использую компонент Office Fabric UI React Detaillist. Я хочу добавить заголовок поверх заголовков столбцов, как показано ниже:

enter image description here

Пожалуйста, помогите, как этого добиться, используя offfice Fabric UI React. Референсный интерфейс Fabric реагирует на подробный список ниже:

https://developer.microsoft.com/en-us/fabric#/components/detailslist

1 Ответ

0 голосов
/ 18 января 2019

Документы на пользовательском интерфейсе действительно устарели. Пока пакет регулярно обновляется (что здорово).

Для лучшего понимания этого пакета попробуйте просмотреть исходный код / ​​примеры на github.

Глядя на IColumn тип на https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts#L299

имеет 

   /**
   * If provided uses this method to render custom cell content, rather than the default text rendering.
   */
  onRender?: (item?: any, index?: number, column?: IColumn) => any;

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

Вот несколько примеров

https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx

https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomGroupHeaders.Example.tsx

...