如何从组件访问自定义命名空间（react-）JSS 主题？

Question

我正在创建一个 react/redux 应用程序，并希望利用 JSS 主题来设置我的应用程序/组件的样式。我还在使用其他使用 JSS 主题的库，例如Material UI，因此我需要创建一个命名空间主题，如http://cssinjs.org/react-jss?v=v8.1.0#theming 中所述，以避免与其他主题冲突。

这是否意味着我必须在 每个 组件中导入我的命名空间主题，然后将其传递给 injectSheet？即：

import React from 'react
import injectSheet, {ThemeProvider} from 'react-jss

// import my custom namespaced theming object...
import theming from '../path/to/my/custom/theming'

const styles = theme => ({
  container: {
    background: theme.background,
  }
})

const Demo = () => (
    <div className={props.classes.container}>
      //...
    </div>
)

// injectSheet with my custom namespaced theming object..
export default injectSheet(styles, {theming})(Demo)

这感觉很麻烦。这是另一种方式吗？我错过了什么吗？在此先感谢:)

Answer 1

您可以将您的 injectSheet 函数包装在一个中心位置并始终在那里传递主题。