Reactjs 如何为Bootstrap4容器中的行指定等于列高度的总高度

如果我有一个这样的容器，如何使第二列中的行延伸其高度，使其与第一列中的高度完全匹配：

      <Container fluid>
        <Row>
          <Col>
            Only row in first column
            <img src="bigPhoto.png" />
          </Col>
          <Col >
            <Row>
                First row in second column
            </Row>
            <Row>
                Second row in second column
            </Row>
            <Row>
                Third row in second column
            </Row>
            <Row>
                Fourth row in second column
            </Row>
          </Col>
        </Row>
      </Container>

仅第一列中的行
第二列中的第一行
第二列中的第二行
第二列第三行
第二列第四行

您可以将

display:flex

添加到父组件中

.parent{
显示器：flex；
边框：1px纯红；
}
行，列{
边框：2件纯黑；
}

仅第一列中的行
第二列中的第一行
第二列中的第二行
第二列第三行
第二列第四行

您需要在包含列上使用以下引导类

 d-flex align-items-stretch

---

这就是在第二列中包含4项的列，我最终设置了最小高度：“图像高度”/“行数”，以获得我想要的效果。但是，它不会动态缩放“height image”变量。我将尝试查看其他人的答案，看看在此期间我是否能做到这一点。

@user1511956希望我正确理解了您的问题并解决了它。如果解决了，请接受解决方案。如果您仍然面临问题，请添加确切问题的屏幕截图。我想第一列中有两列，一行（这占据了很多高度），第二列中有四行，而不是六列。这有意义吗？