摘要：
1、JSX 在React17之前，我们写React代码的时候都会去引入React，并且自己的代码中没有用到，这是为什么呢？ 这是因为我们的 JSX 代码会被 Babel 编译为 React.createElement，我们来看一下babel的表示形式。 需要注意的是： 自定义组件时需要首字母用大写， 阅读全文
摘要：
react diff 算法 我们知道React会维护两个虚拟DOM，那么是如何来比较，如何来判断，做出最优的解呢？这就用到了diff算法 diff算法的作用 计算出Virtual DOM中真正变化的部分，并只针对该部分进行原生DOM操作，而非重新渲染整个页面。 传统diff算法 通过循环递归对节点进 阅读全文
摘要：
先来几个术语： | 官方 | 我的说法 | 对应代码 | | | | | | React element | React元素 | let element=<span>A爆了</span> | | Component | 组件 | class App extends React.Component { 阅读全文
摘要：
解释 React 中 render() 的目的。 每个React组件强制要求必须有一个 render()。它返回一个 React 元素，是原生 DOM 组件的表示。如果需要渲染多个 HTML 元素，则必须将它们组合在一个封闭标记内，例如 <form>、<group>、<div> 等。此函数必须保持纯 阅读全文
摘要：
一、写一个时钟 用 react 写一个每秒都可以更新一次的时钟 import React from 'react' import ReactDOM from 'react-dom' function tick() { let ele = <h1>{ new Date().toLocaleTimeSt 阅读全文
摘要：
React 高阶组件、Render props、hooks 有什么区别，为什么要不断迭代 这三者是目前react解决代码复用的主要方式： 高阶组件（HOC）是 React 中用于复用组件逻辑的一种高级技巧。HOC 自身不是 React API 的一部分，它是一种基于 React 的组合特性而形成的设 阅读全文
摘要：
一、React 渲染流程和更新流程 react渲染流程：jsx -> 虚拟dom -> 真实dom react更新流程：props/state改变 -> render函数重新执行 -> 生成新的虚拟dom树 -> 新旧虚拟dom树进行diff -> 计算出差异进行更新 ->更新到真实的dom树 所以 阅读全文
摘要：
展示组件(Presentational component)和容器组件(Container component)之间有何不同 展示组件关心组件看起来是什么。展示专门通过 props 接受数据和回调，并且几乎不会有自身的状态，但当展示组件拥有自身的状态时，通常也只关心 UI 状态而不是数据的状态。 容 阅读全文
摘要：
我们先看下 React 官方文档对这两个 hook 的介绍，建立个整体认识 useEffect(create, deps): 该 Hook 接收一个包含命令式、且可能有副作用代码的函数。在函数组件主体内（这里指在 React 渲染阶段）改变 DOM、添加订阅、设置定时器、记录日志以及执行其他包含副作 阅读全文
摘要：
react diff 算法 我们知道React会维护两个虚拟DOM，那么是如何来比较，如何来判断，做出最优的解呢？这就用到了diff算法 diff算法的作用 计算出Virtual DOM中真正变化的部分，并只针对该部分进行原生DOM操作，而非重新渲染整个页面。 传统diff算法 通过循环递归对节点进 阅读全文