如何设置新@fluentui/react-button [v8 beta] 的样式？

Question

是否有关于如何将样式自定义应用到新 Button 的文档？使用 IButtonStyles 界面的样式在新按钮上被破坏，按照下面的代码。

import { PrimaryButton } from '@fluentui/react';
import { Button as FluentButton } from '@fluentui/react-button';

const btnStyles = {
    rootHovered: {
        background: "red"
    }
};

return (
    <div>
         <PrimaryButton styles={btnStyles}/>
         <FluentButton styles={btnStyles}/>
    </div>
)

Answer 1

查看了定义新反应按钮的文件，似乎需要一个 ButtonTokens。猜测这与更广泛的 Fluent UI 转向样式标记的趋势有关。

const btnStyle : ButtonTokens = { borderColor: 'red' }
return (
   <FluentButton tokens={btnStyle} />
)