React非グローバルスタイルの設定styled-compoentsコンポーネントの使用について

cssファイルが導入されている場合、1つのファイルに導入されている限り、import'./はグローバルに有効になります.index.css’; stled-componentsを使用すると、スタイルはグローバルに適用するcss 1であれば、グローバルではなく、私たちが望むコンポーネントにのみ有効になります.対応するcss接尾辞ファイルをJs接尾辞2と命名する.

import { createGlobalStyle } from 'styled-components'`
    export const GlobalStyle = createGlobalStyle`
        css  
    `

3.タグとしてルートファイルに取り込む

import { GlobalStyle } from "./style";
    class App extends Component {
      render() {
        return (
          
            
            
            

          
        );
      }
    }

如果是非全局的样式

1.新建一个js文件写css代码

import styled from 'styled-components';
export const HeaderWrapper = styled.div`
  position:relative;
  height:58px;
  border-bottom:1px solid #f0f0f0;
`

プロジェクトに導入され、

をラベルとして使用する.

 import { HeaderWrapper} from './style';
  
    
    
  

参考記事https://blog.csdn.net/qq_32063079/article/details/83277054