styled-components - 如何将 aria 属性添加到样式化组件？

Question

我正在使用 styled-components npm 包，需要将 aria-haspopup 属性添加到我的扩展 Button 组件。我尝试了以下方法，但这并没有添加属性:

import Button from './button';

const StyledBtn = Button.attrs({
    'aria-haspopup': 'true',
}).extend``;

Answer 1

我发现解决方案是:

新的 styled-components v4 语法:

import Button from './button';

const StyledBtn = styled(Button).attrs({
    'aria-haspopup': 'true',
})``;

旧语法:

import Button from './button';

const StyledBtn = Button.extend.attrs({
    'aria-haspopup': 'true',
})``;

https://www.styled-components.com/docs/api

https://medium.com/styled-components/styled-components-v4-new-final-finalest-for-real-final-final-psd-fa4d83398a77