您能解释一下如何使用带有自定义属性名称的SC吗?
此代码不起作用,我不明白为什么。
我希望收到这样的 <div customAttrName="customAttrName"></div>
export const TagName = styled.div.attrs((props) => {
console.log("props", props);
return {
type: "anyType",
size: 25,
customAttrName: "customAttrName"
};
})`
padding: 4px 7px 2px 10px;
margin: 5px 6px 5px 0;
border-radius: 5px;
font-family: "MullerRegular", sans-serif;
`;
export default function App() {
return (
<div className="App">
<h1>Hello CodeSandbox</h1>
<TagName>Start editing to see some magic happen!</TagName>
</div>
);
}
对于海关数据属性,您需要使用前缀data-*
:
export const TagName = styled.div.attrs((props) => {
console.log("props", props);
return {
type: "anyType",
size: 25,
data-customAttrName: "customAttrName"
};
})`
padding: 4px 7px 2px 10px;
margin: 5px 6px 5px 0;
border-radius: 5px;
font-family: "MullerRegular", sans-serif;
`;
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句