qq_45803050的博客

代码优雅化进阶学习（三）

代码优雅化进阶学习（二）

React 执行架构流程详细----归阶段 mount 时流程（三）

React 执行架构流程详细----递阶段 mount 时流程（二）

React 执行架构流程概览

useRef 源码解读

useEffect 和 useLayoutEffect 的源码解读

useState源码解读 及 手撕 useState 实现

使用TS 封装 自定义hooks，实现不一样的 CRUD

hooks 内部结构

Fiber的理解

温故知新 -- react 官方文档总结2

温故知新 -- react 官方文档总结1

React.PureComponent 和 React.Component 的区别

React.fragment 和 有什么区别

pureComponent

react-router V6 版本的使用（自己封装了 Redirect等）IndexRouter.js 使用useRoute 做全局路由的搭建，包括嵌套路由，路由重定向，路由拦截（自己封装），路由懒加载（做了一个简单的封装）等import React from 'react';import {useRoutes} from "react-router-dom";import LazyLoad from "./Lazyload";import NewsSandBox from "../views/

React 中 受控组件和非受控组件区别广义的来说：react 组件的数据渲染是否被调用者传递的 props 完全控制，控制则为受控组件，否则为非受控组件非受控组件：非受控组件将真实数据存在 DOM 节点中，所以在使用非受控组件时，有时候反而更容易同时集成React 和 非 React 代码，如果不介意代码美观性，并且希望快速编写代码，使用非受控组件往往可以减少你的代码量，否则，就使用受控组件非受控方式能简化代码，比较适用于就在本组件的数据处理，如果要关联到要把数据传出去的话，其中不会再次调用 s

react中 state 和 props 的区别总结联想法：注意：状态就类比一下自己的状态，调节状态，属性就是别人赋予给你的 ，不是很方便的改动

setState 的同步和异步执行规则：setState 处在同步的逻辑中，异步更新状态，异步更新真实 DOMsetState 处在异步的逻辑中，同步更新状态，同步更新真实DOM什么叫处在异步逻辑中？比如说 setState 函数被包裹在 setTimeout 函数里面执行，这就是其中一种情况代码实现：import React, {Component} from 'react';import BetterScroll from 'better-scroll'class BetterScr

react 与 vue 的双向数据绑定的实现区别react 实现双向数据绑定import React, {Component, Fragment} from "react";class TodoList extends Component { constructor(props) { super(props); // react 定义组件的数据就需要定义在 state 里面 this.state = { inputValue: '哈哈哈', lis

react 踩坑记录报错：Uncaught TypeError: Cannot read properties of undefined (reading ‘forEach’)at Object.injectIntoGlobalHook (react-refresh-runtime.development.js:488:1)at Object…/node_modules/@pmmmwh/react-refresh-webpack-plugin/client/ReactRefreshEntry.js

react 生命周期函数浅析图片示意：代码描述： // 生命周期函数 // 在组件即将被挂载到页面的时刻自动执行 componentWillMount() { console.log('componentWillMount') }render(){ console.log('render')} // 组件第一次被挂载到页面之后，自动被执行 componentDidMount() { console.log('componentDidMount')

TodoList实现增加和删除：import React, {Component} from 'react';class TodoList extends Component { //使用方法2： myRef = React.createRef(); state = { list: [1, 2, 3] } render() { return ( <div> <input type="text" re