Question

55

current is always null when using React.createRef

rated 0 times [ 60] [ 5] / answers: 1 / hits: 89011 / 6 Years ago, sun, august 5, 2018, 12:00:00

I was trying to do this.

I must be missing something, but I don't understand why current is always null in this example.

class App extends React.PureComponent {

  constructor(props) {

    super(props);

    this.test = React.createRef();

  }

  render() {

    return <div className=App>current value : {this.test.current + }</div>;

  }

}

You can check my test case here

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

chase

Add To Favorites

Follow

Total Points: 78

Total Questions: 106

Total Answers: 93

Location: Comoros

Member since Tue, Mar 14, 2023

1 Year ago

chase questions

1 How to set the download file extension for blob data

Thu, Mar 31, 22, 00:00, 2 Years ago

1 React changing react-icon color on mouse hover

Thu, Jul 1, 21, 00:00, 3 Years ago

1 Passing Objects as Argument to GraphQL Mutation (graphql-request)

Sun, Dec 20, 20, 00:00, 3 Years ago

1 how to get data from response from fetch javascript request

Sat, Dec 12, 20, 00:00, 4 Years ago

1 CSS select all previous siblings for a star rating

Mon, Sep 14, 20, 00:00, 4 Years ago

View All

answered 6 Years ago kiyam · Accepted Answer

Because you forgot to assign the ref to some dom element. You are only creating it.

Write it like this:

class App extends React.PureComponent {

  constructor(props) {

    super(props);

    this.test = React.createRef();

  }



  handleClick = () => alert(this.test.current.value)



  render() {

    return (

      <div className="App">

        <input ref={this.test} />

        <button onClick={this.handleClick}>Get Value</button>

      </div>

    )

  }

}

Working Example.