如何将 reactjs 组件缩放到浏览器中

【问题标题】：How to scale a reactjs component into the browser如何将 reactjs 组件缩放到浏览器中
【发布时间】：2017-01-18 18:41:14
【问题描述】：

如何将已经创建的 React 组件缩放到已经预定义了高度和宽度的浏览器中？？？

componentDidMount(x,y,z){
 this.setState({height:window.innerHeight+'px'});
}

不确定这是否是正确的方法，我不确定是否必须先获取视口大小，然后再尝试在浏览器上缩放。如何才能完成？

【问题讨论】：

标签： javascript css reactjs scale

【解决方案1】：

您可以将样式直接分配给 DOM 元素。例如：

render() {
    return <div style={{ height: window.innerHeight }} />;
}

如果您需要在初始渲染后计算样式，也许在一些用户交互之后，您可以计算并将样式存储在状态中：

// ... calculate and set state logic somewhere
// eg: someFunction() { this.setState({ height: window.innerHeight }); }
render() {
    let styles = {};
    if (this.state.height) {
        styles.height = this.state.height;
    }

    return <div style={styles} />;
}

【讨论】：