React 将具有一个类名的最小高度的元素设置为等于具有另一个类名的最小高度的元素

【问题标题】：React set an element with one className's min-height equal to the element with another className's min-heightReact 将具有一个类名的最小高度的元素设置为等于具有另一个类名的最小高度的元素
【发布时间】：2017-05-10 12:55:54
【问题描述】：

我有一个带有两个 <div> 标签的 React 组件，每个标签都有不同的 classNames 可以说：className="firstClass" 和 className="secondClass"。

如何将secondClass 的min-height 值设置为等于firstClass 的min-height 值？

【问题讨论】：

如何设置firstClass的min-height值？
在componentDidMount() 函数中我设置了`min-height'。

标签： css reactjs

【解决方案1】：

不要直接设置 DOM。您需要阅读setState 和props。

setState 触发重新渲染，因此无论何时执行this.setState({minHeight: newValueHere});，它都会自动使用新值更新渲染方法。

class Component extends React.Component {
  constructor() {
    super();
            
    this.state = {
      minHeight: "600px"
    };
  }

  render() {
    return (
      <div>
        <div className="firstClass" style={{minHeight: this.state.minHeight}} />
        <div className="secondClass" style={{minHeight: this.state.minHeight}} />
      </div>
    );
  }
}

【讨论】：