獲取React元件的DOM

hy_發表於2019-05-06
React元件

React元件在渲染時會掛載到DOM上，所以它會有真實的DOM結構，為什麼需要它的DOM結構呢，以後你肯定會需要的:)

render () {
  return (
    <div className="container" ref={(e) => {this.instence = e;}}></div>
  )
}複製程式碼

這樣在渲染後就把這個元件的DOM結構獲取到this.instence屬性上了，注意因為是渲染後，所以在componentWillMount () 中是獲取不到DOM的：

componentWillMount () {
  console.log(this.instance); // undefined
}複製程式碼

要在掛載後獲取到：

componentDidMount () {
  console.log(this.instance); // <div>...</div>
  console.log(this.instance.className); // container
}複製程式碼

睡覺啦，收工:)


相關文章