React Hook 01 State Hook

54 阅读1分钟

Hook 可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性。本质就是 JavaScript 函数。它可以让你“钩入” React 的特性。

1 . 什么时候使用 State Hook ?

在编写函数组件时需要向其添加一些 state 来用时 。

2 . 使用方法

  • 2 . 1 先引入 React 中的 useState Hook :

0446.png

  • 2 . 2 使用 useState 方法声明 state 变量 :

useState() 方法接收的唯一一个参数就是 state 的初始值 。返回值为当前 state 以及更新 state 的函数 。所以可以用解构赋值的方法来成对的获取我们创建的 state 值以及更新 state 的函数 。

0447.png

如上 ,我们就声明了一个初始值为 0 的 state 变量 count 。

  • 2 . 3 更新 state 变量 : 直接使用 useState()方法返回的更新函数 :

0448.png

3 . 可以声明使用多个 state 变量

0449.png