<div style={
   
   { display: 'flex', justifyContent: 'space-between', alignItems: 'center', width: 200,gap:20 }}>
    <div style={
   
   { flex: 1,background:'red' }}>
      <div style={
   
   { width: '100%', height: 100 }}></div>
    </div>
   <div style={
   
   { flex: 1,background:'blue',color:'#fff' }}>123</div>
 </div>

代码如上，此时第二个flex:1的div高度只会是自身高度，而并非是跟第一个flex:1的div同高度。

如何让第二个flex:1的div跟左侧的一样高。去掉父元素的alignItems: 'center'属性，就可以得到

如果要第二个盒子123居中，直接对蓝盒子进行flex布局即可