How do we react to ref changes using the createRef API?


(Joe Pea) #1

React.createRef makes working with refs a lot cleaner… but how to we react to ref changes? The docs don’t seem to say.

f.e. if we have

class Foo extends React.Component {
  constructor(props) {
    super(props)
    this.ref = React.createRef()

    this.someCondition = false

    // some async code or external props or redux changes the value of `someCondition`
  }
  render() {
    return this.someCondition ? <a ref={this.ref}></a> : <p ref={this.ref}></p>
  }
}

then how do we react to changes in which child is referenced?