Согласованность между определениями компонентов структуры пользовательского интерфейса Office

#office-ui-fabric

#office-ui-fabric

Вопрос:

(Отказ от ответственности: я задаю это здесь, поскольку это соответствует вопросу, и они не должны публиковаться на github, и у меня очень мало опыта работы с React)

Я создаю порт office-ui-fabric-react для Vue и добился действительно хорошего прогресса со всеми компонентами, которые используют эту styled функцию (например, Toggle). Но я заметил, что многие другие компоненты не соответствуют той же структуре. До сих пор я сталкивался с двумя вариантами:

 export const Toggle: React.StatelessComponent<IToggleProps> = styled<IToggleProps, IToggleStyleProps, IToggleStyles>(
  ToggleBase,
  getStyles,
  undefined,
  { scope: 'Toggle' }
);
  
 @customizable('SpinButton', ['theme', 'styles'], true)
export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState> implements ISpinButton {
  ...
}
  

Во втором варианте .base.tsx файл отсутствует, но компонент определяется непосредственно в .tsx файле. Есть ли разница или причина, почему они разные? Читая код styled и customizable , оба, похоже, делают одно и то же.

Ответ №1:

Fabric, как платформа с открытым исходным кодом, имеет элементы управления, которые были созданы в разное время. Кнопка вращения — это пример элемента управления, который был создан некоторое время назад и не был обновлен для использования нашего текущего подхода «стили»