0
102
ViewsEl estilo de interfaz de usuario fluido no funciona en los comandos pasados con botones para CommandBar
estoy usando Fluent UI en mi proyecto. No sé cómo cambiar el estilo de la hoover en CommandBar .
Inicialicé mis botones con este código simple en javascript:
// inside `buttons` array key: 'newfolder', text: 'New Folder', iconProps: { iconName: 'NewFolder', styles: { root: { color: 'orange' }, rootHovered: { color: 'red' } } }, onClick: ... Luego estoy pasando estos botones a CommandBar :
<CommandBar items={buttons} styles={{ root: { paddingLeft: '5px' }, }} /> y puedo anular el color predeterminado para pedir uno. 
Mi pregunta es, ¿cómo configurar el color del mouse sobre el botón en el componente CommandBar ? 
Como puede ver, sigue siendo azul incluso si pasé red como color rootHovered. No puedo pasar la propiedad Hovered a CommandBar porque recibo un error:
(property) rootHovered: {} Type '{ root: { paddingLeft: string; }; rootHovered: {}; }' is not assignable to type 'IStyleFunctionOrObject<ICommandBarStyleProps, ICommandBarStyles> | undefined'. Object literal may only specify known properties, and 'rootHovered' does not exist in type 'IStyleFunctionOrObject<ICommandBarStyleProps, ICommandBarStyles>'.ts(2322)1 answers
Answer question0
Puede cambiarlo al pasar el mouse usando el accesorio buttonStyles como este:
text: 'New Folder', buttonStyles: { iconHovered: { color: 'red' } }, Obtenga más información sobre este accesorio en: https://developer.microsoft.com/en-us/fluentui#/controls/web/commandbar#implementation en la sección ICommandBarItemProps interface