リアクタで実際の要素の高さを取得できません

Question

2行にテキストを合わせる必要があります。私はReactコンポーネントを持っていますが、要素のレンダリング後に高さのみの高さを取得することはできません。これは私のコンポーネントです

constructor (props) { 
    super(props) 

    this.state = { 
     text: props.text 
    } 
    } 

    componentDidMount() { 
    let element = ReactDOM.findDOMNode(this) 
    let parent = element.parentNode 
    let originalText = element.innerText 
    let containerHeight = parent.offsetHeight 
    let temp = originalText 
    if (containerHeight < element.offsetHeight) { 
     while(containerHeight < ReactDOM.findDOMNode(this).offsetHeight) { 
      temp = temp.substr(0, temp.length-1) 
      this.setState({ 
      text: temp 
      }) 
      i++ 
      console.log(temp,containerHeight,ReactDOM.findDOMNode(this).offsetHeight); 
     } 

     temp = temp.substr(0, temp.length-4) + '...' 

     this.setState({ 
     text: temp 
     }) 
    } 
    } 


    render() { 
    return (
     <span> 
     {this.state.text} 
     </span> 
    ) 
    } 

それぞれの再レンダリング後にどのように要素の高さを得ることができますか？

PS私は問題を発見：

私はここcomponentDidUpdate（）を使用する必要があり、私はそれは私が状態を更新するたびにトリガされているため、componentDidUpdate（）メソッドでwhileを使用する必要はありません。

Answer 1

トリガーcomponentDidMountを登録しました。 componentDidUpdateも登録する必要があります。この文書は反応にライフサイクルを理解する

チェック：

https://busypeoples.github.io/post/react-component-lifecycle/

Answer 2

componentDidMountは、部品が実装された後、一度だけ呼び出されています。詳細については、反応のライフサイクルdocumentationを確認してください。

コンポーネントの状態が更新された際に再び呼び出されていると、再レンダリングされている方法は、（そのために）ある：

componentWillReceiveProps() 
shouldComponentUpdate() 
componentWillUpdate() 
render() 
componentDidUpdate() 

はあなたのコンポーネントの後の高さを再計算する必要がありますので、あなたのロジックをcomponentDidUpdateの中に入れておき、設定する必要があります。