Come and join us!

“The Newbies of Little and Hill” provides technical information and a series of basic articles for front-end developers. For a better user experience, please move to our official website of Xiaoheshan beginners (https://xhs-rookies.com/) to learn, timely access to the latest articles.

“Code tailor”, if you are interested in our articles or would like to make some suggestions, please follow our official account “newbies of Xiaoheshan” at WeChat, and contact us. You can also view our articles on WeChat. Every suggestion or agreement is a great encouragement to us!

Why do we learn hooks

No destructive changes

  • Hooks are completely optional: Can be tried in a component without rewriting any codehook
  • 100% backward compatible ：hookNo damaging changes are included
  • It’s available now ： hookReleased in16.8 the React

motivation

Hook solved a variety of seemingly unrelated problems that we had encountered while writing and maintaining thousands of components for five years. Whether you’re learning React, using it every day, or would rather try another framework that has a similar component model to React, you’re probably familiar with these problems.

  • It is difficult to reuse state logic between components
  • Complex components become difficult to understand
  • incomprehensibleclass

How can we learn hooks

Now, there are a lot of learning materials on the React official learning website, which describe in detail, but it is very complicated and difficult to understand in terms of examples. However, in the basic article written by Professor Ran, it is easy to understand, but it does not give you a deeper understanding of it. There are more information on other websites, most of them are the translation of the official website or part of the content of the extraction, can not bring you a lot of useful information.

In this series, we provide you with examples that are much easier to understand than on the official website, and with a few highlights that are much easier to understand than on the web. We provide you with a clear understanding of hooks in a short period of time, as well as with the use of simple hooks.

So what are hooks

  • ReactThe framework has long been advocated for useFunction componentHowever, there is a problem with this, and sometimes you need to use itstateOr life cycle and other functions, there can only be usedClass components.
  • hooks 是 16.8 the ReactAdded a feature that it can be in without being writtenClass componentsIn case of usestateAnd other thingsReactfeatures
  • ifFunction componentTo add somestate, now just need to be inFunction componentThe use ofhooksYou don’t need to convert toClass components
  • So in the React API as long as it takesuseEverything at the beginninghooks, such asuseState

Explore the mysteries of hooks in this series of articles.

Next day forecast

In the next section, we will officially start the study of hooks.