我有一个呈现两个子组件的组件,考虑到以下情况,我希望两个组件处于相同的高度 1. 当屏幕处于正常尺寸时 2. 当我调整屏幕大小时什么是最好的策略实现这个?
最佳答案
我会使用一些 JQuery
来实现这一点。检查最高的 child 并将该值应用于另一个 child 。
$(document).ready(function () {
$(window).resize(function () {
$(".child1").height("auto");
$(".child2").height("auto");
var height = Math.max($(".child1").outerHeight(), $(".child2").outerHeight());
$(".child1").height(height);
$(".child2").height(height);
}).resize();
});
.child1 {background-color:red; float:left; width:50%;}
.child2 {background-color:blue; float:left; width:50%;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div>
<div class="child1">
</div>
<div class="child2">
<br /><br /><br /><br /><br /><br /><br />
</div>
</div>
关于reactjs - 使父组件中的两个子组件具有相同的高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52823402/