@wordpress/components Button变体没有样式

Question

每当我导入Button组件..。

import { Button } from "@wordpress/components";

然后，...and与variant一起使用它：

if (attributes.imageId) {
  return (
    <Button variant="secondary" onClick={open}>
      Change image
    </Button>
  );
}
return (
  <Button variant="secondary" onClick={open}>
    Select image...
  </Button>
);

它从不以变体形式呈现：

我确信这应该会根据这些文档呈现不同的内容：

https://developer.wordpress.org/block-editor/reference-guides/components/button/

它应该是这样的：

--如果我使用variant="primary"

，它也不能工作

最后，按钮有些样式。也就是说，如果我这样做：

<Button>Test</Button>
<button>Test</button>

您可以看到默认按钮与wordpress按钮：

我做错了什么？

Package.json依赖关系：

"dependencies": {
    "@wordpress/block-editor": "^7.0.2",
    "@wordpress/blocks": "^11.1.0",
    "@wordpress/i18n": "^4.2.2"
},
"devDependencies": {
    "@wordpress/scripts": "^18.0.1"
}

Answer 1

WordPress组件文档从存储库的开发分支中提取，这意味着它们可能描述尚未发布的特性和功能。

在WordPress中使用的库的当前版本中，可以使用isPrimary、isSecondary或isTertiary属性声明变量：

<Button isSecondary onClick={open}>
    Select image...
</Button>