styled-components解決全局樣式'injectGlobal' 廢除的問題

在以前的styled-components中設置全局樣式只需要 引入injectGlobal 即可，然而今天我用injectGlobal 的時候，總是提示不存在，找了半天找到原因。

The injectGlobal API was removed and replaced by createGlobalStyle in styled-components v4. 用官方的話來講，就是這個API 從現在開始廢除了，換成 createGlobalStyle 新的API ，作為一個樣式組件出現，按照樣式組件思想，以一個標簽形式被引入。

例如

1. 用createGlobalStyle定義全局樣式

import { createGlobalStyle } from 'styled-components'

export const Globalstyle = createGlobalStyle`　

body{

　　margin: 0;

　　padding: 0

　}`

然后按照樣式組件引入即可

2. 在項目主文件導入樣式

import { Globalstyle } from './style'

 

3.以樣式組件的方式當作標簽引入

render() {

　　return (

　　　　<div>

　　　　　　<Globalstyle/>

　　　　</div>

);