AceDevHub
Advanced React Interview QuestionsAdvancedConcept

React · Question 78

What does the React use API do, and how is it different from ordinary Hooks?

Direct answer

use reads a resource such as a Promise or Context value; reading a pending Promise suspends the component, and unlike Hooks such as useState, use can be called inside loops and conditionals.

Comments.jsx
function Comments({ commentsPromise, show }) {
  if (!show) {
    return null;
  }

  const comments = use(commentsPromise);

  return comments.map(comment => (
    <p key={comment.id}>{comment.text}</p>
  ));
}
  • Promise: a pending Promise suspends; a resolved Promise provides its value; a rejection propagates to error handling.
  • Context: use can read the nearest Context value similarly to useContext.
  • Calling rules: use must still be called from a Component or Hook, but it may appear conditionally or in loops.