It is an interesting hook called useSyncExternalStore
came from React 18. After I went through the doc, I had totally no idea about how to use it and why it works. Luckily, I got a task I thought I can use this hook, and meanwhile I traced the source code to understand useSyncExternalStore
implementation. In this article, I will explain how it works internally and show a demo which is differ from the doc.
Tag: Typescript
Use ChatGPT to translate new react-dev doc
react.dev was released on March 17. I’ve read the beta version for a while. I love the Escape Hatches section which has many correct and recommended usages about react hooks. After new react.dev released, I noticed that there’s no translation. I haven’n played OpenAI API yet, so I think this is a good opportunity to play ChatGPT with its translation feature for react.dev.
TOC
How to use React hook - useImperativeHandle
Today, We’re going to introduce the way to use a great and useful React hook - useImperativeHandle. Have you ever think what is meaning of Imperative?
Imperative
In grammar, a clause that is in the imperative, or in the imperative mood, contains the base form of a verb and usually has no subject. Examples are ‘ Go away’ and ‘ Please be careful’. Clauses of this kind are typically used to tell someone to do something.
So we can just think useImperativeHandle
is Let ref
access the handle. Go back to useImperativeHandle definition:
useImperativeHandle is a React Hook that lets you customize the handle exposed as a ref.
Right? Okay, before starting it, we have to recap how we do if we don’t use it.