javascript - 启用带有情感的全局主题？

我关注了 https://github.com/emotion-js/emotion/issues/546，其中 Emotion 的作者 Kye 提到了一个解决方案，尽管我并不完全理解它。

所以我做了一个小 CodeSandBox 来实现问题中提供的细节。如何使 background-color 主题在 injectGlobal 中工作？

最佳答案

针对使用情感10的人们的更新:

import React from 'react'
import { useTheme, ThemeProvider } from 'emotion-theming'
import { css, Global } from '@emotion/core'

const GlobalStyles = () => {
  const theme = useTheme()
  return (
    <Global styles={css`
      body {
        background: ${theme.bg};
      }
    `} />
  )
}


const App = () => (
  <ThemeProvider theme={{ bg: 'tomato' }}>
    <main>
      <h1>Hi</h1>
      <GlobalStyles />
    </main>
  </ThemeProvider>
)

关于javascript - 启用带有情感的全局主题？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/51637950/