1 useState函数的第一个参数,是state变量的初始值。

2 每次渲染时,多个State Hook的顺序、数量都是一样的。(不能多、不能少)

3 state变量是只读的

4 state变量发生变化(比较引用地址),会触发新的渲染(再次执行渲染函数);

state变量没变化(比较引用地址),不触发新的渲染。

import React, { useState } from "react";

// 记录渲染次数
let times = 0; export default function App(props) {
// 打印渲染次数
console.log("函数式组件", ++times); const [counter, setCounter] = useState(0); return (
<div>
<button onClick={e => setCounter(counter + 1)}>按钮:{counter}</button>
</div>
);
}

State Hook的更多相关文章

  1. [React] Write a Custom State Hook in React

    Writing your own custom State Hook is not as a daunting as you think. To keep things simple, we'll r ...

  2. 【React 资料备份】React Hook

    Hooks是React16.8一个新增项,是我们可以不用创建class组件就能使用状态和其他React特性 准备工作 升级react.react-dom npm i react react-dom - ...

  3. [React] Write a Custom React Effect Hook

    Similar to writing a custom State Hook, we’ll write our own Effect Hook called useStarWarsQuote, whi ...

  4. [React] Use the React Effect Hook in Function Components

    Similar to the State Hook, the Effect Hook is “first-class” in React and handy for performing side e ...

  5. [React]Hook初探

    Hook是什么 Hook是React从16.8开始支持的特性,使用Hook可以在不使用class时使用state Hook支持在不需要修改组件状态的情况下复用逻辑状态,从而解决使用render pro ...

  6. React使用hook

    Hook 是 React 16.8 的新增特性.它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性. 为什么会有hook 在组件之间复用状态逻辑很难,需要重新组织你 ...

  7. 七天接手react项目 —— state&事件处理&ref

    state&事件处理&ref 在 react 起步 一文中,我们学习了 react 相关知识:jsx.组件.props.本篇将继续研究 state.事件处理和ref. state St ...

  8. 开发中常用的Hook

    开发中常用的Hook 什么是Hook? Hook 是一些可以让你在函数组件里"钩入" React state 及生命周期等特性的函数,用来实现一些 class 组件的特性的. 1 ...

  9. 【Android应用开发】RecycleView API 翻译 (文档翻译)

    . RecyclerView extends ViewGroupimplements ScrollingView NestedScrollingChild java.lang.Object    ↳ ...

随机推荐

  1. 使用class 自动创建设备节点

    #include <linux/init.h>// __init __exit #include <linux/module.h> // module_init module_ ...

  2. BZOJ 1085(IDA*)

    题面 传送门 分析 首先,直接搜索肯定会TLE 很容易想到用迭代加深的方法,限定搜索深度 但是,这样仍然不够,需要用启发式的方法优化 我们设计一个估价函数f(x)=g(x)+h(x)f(x)=g(x) ...

  3. [SPOJ]Count on a tree II(树上莫队)

    树上莫队模板题. 使用欧拉序将树上路径转化为普通区间. 之后莫队维护即可.不要忘记特判LCA #include<iostream> #include<cstdio> #incl ...

  4. 三:GC回收机制

    jvm垃圾回收机制: jvm中有个垃圾回收线程,它是低优先级的,当虚拟机空闲或堆内存不足时,它就会去清除不可达对象. GC是如何去判断对象是否能被回收的 早期GC判断对象是否能被回收时用的引用计数法, ...

  5. Elasticsearch7.X 入门学习第九课笔记-----聚合分析Aggregation

    原文:Elasticsearch7.X 入门学习第九课笔记-----聚合分析Aggregation 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. ...

  6. webstorm 2019 去掉编辑器右侧白线

    第一步:打开设置 第二步: 第三部:apply   关闭设置

  7. xxPay搭建步骤

    随着电子商务的发展,移动支付也走进我们的日常生活,就像很多基础业务,如物流.云平台一样,我们现在做什么都离不开她.正因为如此,支付是当下最活跃最前沿的话题,很多流行的技术最早用来实现支付,很多新的业务 ...

  8. JS window对象 返回前一个浏览的页面 back()方法

    JS window对象 返回前一个浏览的页面 back()方法,加载 history 列表中的前一个 URL. 语法: window.history.back();   返回前一个浏览的页面 back ...

  9. oracle汇编03

    .long expression1, expression2, ..., expressionNThe .long directive generates a long integer (32-bit ...

  10. CSP-S2019 停课日记

    前言 不想上文化课,于是就停课了 (雾) \(10.13\) 停课前一天 今天名义上是放假,所以不算停课. 老师和同学们听说我要停课,都十分的不舍.我啥也没说就悄悄溜到一中来了. \(10.14\) ...