框架粗略对比，### 一、全景图 来自大圣老师的开课吧网课中的截图 ![](https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/0ca482b52a07

Hooks API 从 2018 年开始进入开发者视野至今已经将近两年了，但目前还有很多同学对 Hooks 有很多的不理解和困惑。

我工作中的技术栈主要是 React + TypeScript，这篇文章我想总结一下如何在项目中运用 React 的一些技巧解决一些实际问题，本文中使用的代码都是简化后的，不代表生产环境。生产环境的代码肯定比文中的例子要复杂很多，但是简化后的思想应该是相通的。 那么比如在路由发生…

React 在 v16.8 的版本中推出了 React Hooks 新特性。在我看来，使用 React Hooks 相比于从前的类组件有以下几点好处： 关于这方面的文章，我们根据使用场景分别进行举例说明，帮助你认识理解并可以熟练运用 React Hooks 大部分特性。 与 c…

有一段时间没写文章了，总结记录一下个人常用的或个人认为该掌握的八个React Hooks。如果算上自定义Hooks，应该是九个的，但本篇文章就不展开了。我来网易之前是刚学的React框架，当时看了一天公司项目，然后发现得去看一下React Hooks，看了一个周末，做了点总结，…

这里当点击按钮以后会引起num变化从而重新渲染header和footer两个子组件，造成多余的render性能损耗。 我们都知道react的组件会根据 state和props属性(父组件传递的) 的变化而发生重新re-render渲染，这里用memo或者useMemo包裹以后,…

hooks 设计的初衷就是为了使开发更加快捷简便，因此在使用hooks 的时候，我们不应该吝啬使用较多的hooks，例如我们处理不同状态对应不同逻辑的时候，按照写class的逻辑，我们经常会在一个生命周期函数里写下多个逻辑，并用if区分；在写hooks的时候，因为没有shoul…

在 src/App.tsx 内引用我们的案例组件，在 src/example.tsx 写我们的案例组件。 可以让函数式组件拥有状态管理特性，类似 class 组件中的 this.state 和 this.setState ，但是更加简洁，不用频繁的使用 this 。 你可以把 …

React Hook是React 16.8版本之后添加的新属性，用最简单的话来说，React Hook就是一些React提供的内置函数，这些函数可以让Function Component和Class Component一样能够拥有组件状态（state）以及进行副作用（side …