react中给页面设置全屏的背景图

我简直无法。。原本只要给 html,body,#root 还有容器都设置 height:100% 就可以的事情。可是我这个 react 在 #root 内又套了一个 div 。。。。我真的！！怎么都给它加不了样式！！！！

就是下面介个东西！！ ↓ 可是不给它加高度，它里面的 div 也没法弄。

于是我决定！不把高度定为100%。
我先监测屏幕高度，然后给容器设置动态 style 确定容器高度 ~

class Login extends React.Component {
    constructor() {
        super();
        this.state = {
            clientHeight: document.documentElement.clientHeight, // 屏幕高度
        };
        this.resize = this.resize.bind(this);
    }
    componentDidMount() {
        window.addEventListener("resize", this.resize); //增加
    }

    componentWillUnmount() {
        window.removeEventListener("resize", this.resize); //取消
    }

    resize() {
        this.setState({ clientHeight: document.documentElement.clientHeight }); //监听
    }

    render() {
        return (
            <div className="login-container" style={{ height: this.state.clientHeight }}></div>
        )
    }
}

其它的引入图片再设置 width为100%就可以啦~

tada~~_{react中全屏背景设置完毕}