我正在使用styled-components来构建我的组件。所有接受自定义值的样式属性都在我的组件中重用(应该如此)。考虑到这一点,我想使用某种全局变量,以便更新将传播到所有组件,而无需单独更新每个样式。
像这样的东西:
// Variables.js
var fontSizeMedium = 16px;
// Section.js
const Section = styled.section`
font-size: ${fontSizeMedium};
`;
// Button.js
const Button = styled.button`
font-size: ${fontSizeMedium};
`;
// Label.js
const Label = styled.span`
font-size: ${fontSizeMedium};
`;
我想我的语法错了?另外,我知道在 Javascript 领域不建议使用全局变量,但在设计领域中,跨组件重用样式是绝对必须的。这里有什么取舍?