Как использовать @global с React-JSS - PullRequest
0 голосов
/ 09 января 2020

Я использую React-JSS и не понимаю, как использовать @global для создания глобальных стилей. do c не указывает (насколько я могу судить), как глобальный стиль передается / подключается к приложению React. Я создал пример приложения, в котором я пытаюсь подать глобальные стили в атрибут 'style' компонента верхнего уровня, но это не работает.

codesandbox example

Здесь это приложение. js

import React from "react";

const styles = {
  "@global": {
    body: {
      color: "green"
    },
    a: {
      textDecoration: "underline"
    }
  }
};

export default function App() {
  return (
    <div style={styles} className="App">
      <h1>Hello CodeSandbox</h1>
      <h2>Start editing to see some magic happen!</h2>
    </div>
  );
}

1 Ответ

2 голосов
/ 10 января 2020

Указанная вами документация описывает jss core api. Вы можете посмотреть здесь о том, как его использовать.

Чтобы использовать его вact-jss без работы с экземпляром jss, вы можете использовать ловушки или HOC.

В приведенном ниже примере используются крючки.

import React from "react";
import { createUseStyles } from "react-jss";

const useStyles = createUseStyles({
  "@global": {
    body: {
      color: "green"
    },
    a: {
      textDecoration: "underline"
    }
  }
});

export default function App() {
  useStyles();

  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
      <h2>Start editing to see some magic happen!</h2>
    </div>
  );
}

...