react-jss书写样式

目录

• react-jss的使用

react-jss的使用

• 实现组件化样式、动态样式、避免样式冲突

npm install react-jss
yarn add react-jss

// 使用
import React from 'react';
import { createUseStyles } from 'react-jss';

const useStyles = createUseStyles({
  myButton: {
    color: 'green',
    margin: {
      top: 5,
      right: 0,
      bottom: 5,
      left: 0,
    },
    '& span': {
      fontWeight: 'bold',
    },
  },
});

function MyComponent() {
  const classes = useStyles();
  return <button className={classes.myButton}>Submit<span>Button</span></button>;
}