this.refs.something returns “undefined”

Question

I have an element with a ref that is defined and ends up getting rendered into the page :

    

       ...
    <         


        
      

Answer 1

Update since React version 16.4

In your constructor method define your ref like this

constructor(props) {
  super(props);
  this.russian = React.createRef();
}

In your render where you are using ref do this.

For e.g if you want to have focus when component mounts do this

componentDidMount() {
  console.log(this.russian); 
  this.russian.current.focus();
 }

Reference Refs Documentation React