From the course: Build Modern Web Apps with React, Hooks, State Management, and APIs Using Vite or Next.js

Unlock this course with a free trial

Join today to access over 25,200 courses taught by industry experts.

useRef introduction: DOM elements

useRef introduction: DOM elements

Hello and welcome to lesson number 5. In this lesson, we will do a detail analysis of the useRef hook. We use the useRef hook in React when we want to reference a value and want to persist that across the re-renders without causing a change into our HTML DOM rendering. So far we know that when we declare a state value using useState hook, whenever that value of that state changes, it's going to cause a re-render across wherever the areas this value has been used. For example, our count example. In the count state, if we are displaying the count on a p tag or somewhere in our input tag then as soon as we change the count value it's going to cause a re-render onto the html dom because that value has changed and we want to re-render that to update or show the refreshed value. But at times there are conditions when we want to update a value we want to keep a track of this but we don't want to re-render or don't want to miss the value across the re-renders. Use ref hook comes for the…

Contents