随笔分类 - React
react 插槽传参
摘要：react中其实没法直接给插槽传递参数，只能借助一点技术手段：函数。 这种方式有个专有名词叫：render-props。 render-props的具体的方式就是，子组件作为插槽是用函数的形式，而容器组件渲染的时候对应的就调用这个函数，在调用函数的时候，把需要传递的参数传入函数，这样在插槽函数的作用
react组件传值
摘要：###1.父传子 1.1父组件准备数据,父组件通过属性age直接传递给子组件 父 import React, { useState } from 'react' import Childs from './Childs' export default function RefUse() { cons
react生命周期(详细版)
摘要：首先生命周期分为三个阶段： 挂载：已经插入真实dom 渲染（更新）：正在被重新渲染 卸载：已经移出真实dom ###一、挂载：在组件实例被创建并插入到dom中时，生命周期调用顺序如下 旧生命周期： 1.constructor（props） 2.componentWillMount（） 可以用但是不建
react面试题
摘要：###1.了解redux吗？ redux 是一个应用数据流框架，主要解决了组件之间状态共享问题，原理是集中式管理，主要有三个核心方法：action store reduce 工作流程 view 调用store的dispatch 接受action传入的store，reduce进行state操作 vie
react redux使用
摘要：##前置知识 ###发布者订阅者模式 可用于非父子组件传值。 1.创建一个bus.js 用来放订阅者和发布者的方法。 let bus = { arr: [], // 订阅者（传入回调 subScribe(callback) { this.arr.push(callback) }, // 发布者（执行
react中的setState是同步还是异步？react为什么要将其设计成异步？
摘要：###壹 ❀ 引 了解react的同学都知道，react遵守渲染公式UI=Render(state)，状态决定了组件UI最终渲染的样子（props也可以理解为外部传入的状态），由此可见state对于react的重要性。而在实际使用中，若我们想修改状态必须得借用APIsetState，也只有通过此方法
react ref传递
摘要：使用场景 用于获取到子组件中的某元素的ref。比如子组件中的表单元素。 const Test = ({ref}) => { return <div ref={ref}> <p>hahahha</p> </div> } class TestWarper extends React.Component
react中useState状态异步更新的问题
摘要：疑惑 相信刚开始使用react函数组件的小伙伴也遇到过一个坑，就是 useState 更新状态是异步更新的，但是react 并没有提供关于这个问题的解决方案。那我们能否使用自己的方法来解决这个问题呢？答案肯定是可以的。 状态异步更新带来的问题 就拿一个比较常见的场景来说。在react项目中，我们想在
react 受控组件与非受控组件
摘要：###概述 React 中的受控组件和非受控组件都是针对于表单数据而言的。React 推荐使用受控组件来处理表单数据。 在受控组件中，表单数据由 React 组件的 state 管理。在非受控组件中，表单数据交由 DOM 节点处理，可以使用 ref 来从 DOM 中获取表单数据。 ###受控组件 R
react Hooks 钩子函数
摘要：###什么是Hooks? 首先：React的组件创建方式，一种是类组件，一种是纯函数组件。 React团队认为组件的最佳写法应该是函数，而不是类。 但是纯函数组件有着类组件不具备的特点： 纯函数组件没有状态 纯函数组件没有生命周期 纯函数组件没有this 这就注定，纯函数组件只能做UI展示的功能，如
react router6使用
摘要：1.BrowserRouter 说明：用于包裹整个应用。 import React from "react"; import ReactDOM from "react-dom"; import { BrowserRouter } from "react-router-dom"; ReactDOM.r
redux toolkit使用
摘要：###1. 是什么 what Redux Toolkit包旨在成为编写Redux逻辑的标准方式。它最初的创建是为了帮助解决关于 Redux 的三个常见问题： 配置 Redux 存储太复杂了 我必须添加很多包才能让 Redux 做任何有用的事情 Redux 需要太多样板代码 ###2. 环境安装 注意
React生命周期
摘要：在 React 中，对于每一次由状态改变导致页面视图的改变，都会经历两个阶段：render 阶段、commit 阶段。 只有 class 组件才有生命周期，因为 class 组件会创建对应的实例，而函数组件不会。组件实例从被创建到被销毁的过程称为组件的生命周期。 由 class 组件创建的实例具有生
