ReactJS組件高度'100％'

我想將我的直接子節點<div id='root'>設置爲height: 100%，但是我意識到反應是添加了一個額外的反應節點層，以防止孩子的height: 100%無法正常工作。下面的示例：ReactJS組件高度'100％'

<html> 
<body> 
<div id="root"> <== root node is height:100%, still good here 
    <div data-reactid=".0"> <== added by react? broke the child height 
    <div data-reactid=".0.$/=10" style="height: 100%; background-color: gray;"> <== child can't get 100% height of #root because of the empty div wrapping it

我的JSX代碼不加入這個data-reactid='.0'包裝DIV，所以我沒有在樣式控制。所以這裏的問題是，我如何控制這個包裝div，或者如何使用其他方法實現height:100%？

謝謝！

來源

2016-06-28 Allan Jiang

React確實沒有添加包裝div，任何小提琴？ –

包裝DIV應該是在你的代碼，這樣的事情：

render() { 
     return (
      <div> // the wrapper div 
       <div style={{height: '100%','background-color': 'gray'}}></div> 
      </div>); 
    }

來源

2016-06-28 06:25:54 qunshan

body{ 
height:100% 
} 

#root div{ 
height:100% 
}

在你的CSS添加此，它爲我工作。

來源

2017-03-05 14:28:03 user3785155

#root > div { 
    height:100%; 
}

來源

2017-06-13 19:43:39 froston

ReactJS組件高度'100％'

回答

相關問題