欢迎光临
我们一直在努力

React.style 关于styled-components 弃用 injectGlobal

问题简要

styled-components 最新版本是v4.1.2,但是从v4开始,就将原来的injectGlobal方法用createGlobalStyle替换了。老版本可以这样写:

//style.js
import {injectGlobal} from ‘styled-components‘;
injectGlobal`
body{
    margin:0;
    padding:0;
    background:red;
}

如果在新版本中这样写会报错:

file

createGlobalStyle

新版本废弃了injectGlobal,又提供了个新的方法——createGlobalStyle

//style.js
import {createGlobalStyle} from ‘styled-components‘;
export const GlobalStyled = createGlobalStyle`
body{
    margin:0;
    padding:0;
    background:red;
}
//在项目主文件(总容器)下引入,我这里用的是App.js
import React from ‘react‘;
import {GlobalStyled} from ‘./style.js‘;
class App extends React.Components{
render(){
    return(
        <div className=‘App‘>
            <GlobalStyled />
        </div>
    )
}
}
当当当,大功告成了! 红红火火恍恍惚惚

好了,可以继续愉快的写样式了。

赞(0) 打赏
未经允许不得转载:散人研 » React.style 关于styled-components 弃用 injectGlobal
分享到: 更多 (0)

评论 抢沙发

1 + 1 =
  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏