如何根据父div的高度调整ReactJS组件的高度？

// 父div的样式
const parentDivStyle = {
  height: '300px', // 或者 '50%'
  display: 'flex',
  alignItems: 'center',
  justifyContent: 'center',
};

// 组件的样式
const componentStyle = {
  height: '100%',
};

// 父组件
const ParentComponent = () => {
  return (
    <div style={parentDivStyle}>
      <ChildComponent />
    </div>
  );
};

// 子组件
const ChildComponent = () => {
  return (
    <div style={componentStyle}>
      {/* 组件内容 */}
    </div>
  );
};