reactjs - 在它自己的主题中引用 JSS 主题中的值

Question

我正在通过 react-jss 使用 jss。假设我有一个定义了基色的主题。然后我想在这个主题中定义一个默认边框，参考基色。

const theme = {
  baseColor: ‘#aaaaaa’,
  defaultBorder: [[1, ‘solid’, this.baseColor]]
}

我还没有找到这个的语法。不可能吗？我是否必须在外面定义颜色并在两个地方都使用它？

const baseColor = ‘#aaaaaa’;
const theme = {
  baseColor: baseColor,
  defaultBorder: [[1, ‘solid’, baseColor]]
}

score 0 · Accepted Answer

我就是这样做的。虽然可能有更好的解决方案。

mytheme.js：

export const baseColor = '#aaa'

const theme = {
  baseColor,
  defaultBorder: [[1, 'solid', baseColor]]
}

export default theme

我在其中看到的优点如下：

score 0 · Accepted Answer

它基本上是一个 JavaScript 问题，而不是 JSS 问题。您可以按照您的建议将其放在单独的变量中。为了使用“this”，您需要创建一个类。

所以我还建议将可重用的东西放在单独的变量中，甚至放在单独的对象中，如果它增长甚至从单独的模块中导出。

2 回答 2