react
Ai.ﻮ
这个作者很懒,什么都没留下…
展开
-
React框架-高阶组件(HOC)
文章目录一、高阶组件的定义二、高阶组件的作用三、高阶组件的特点四、高阶组件的实现一、高阶组件的定义高阶组件(HOC)是 React 中用于复用组件逻辑的一种高级技巧。HOC 自身不是 React API 的一部分,它是一种基于 React 的组合特性而形成的设计模式。通俗来讲,高阶组件(也叫高阶函数、容器组件)是一种设计模式、一种开发经验、一种思想。二、高阶组件的作用作用:实现组件业务逻辑的复用比如当多个组件有相同的某些业务功能时,可以对这些重复的业务进行封装。三、高阶组件的特点特原创 2020-10-17 17:38:35 · 325 阅读 · 0 评论 -
React框架-Context(上下文)
文章目录前言一、Context的作用二、使用Context1、React.createContext2、Context.Provider3、Context.Consumer4、Class.contextType5、Context.displayName6、小结三、Context的应用场景1、主题切换2、获取当前认证的用户3、React-router使用context4、React-redux使用contxt5、跨层级组件传参四、Context的缺点前言在一个典型的 React 应用中,数据是通过 pr原创 2020-10-17 17:24:34 · 397 阅读 · 0 评论 -
React框架-浅谈Hooks
文章目录一、Hooks简介二、为什么使用Hooks三、使用 State Hook1、useState四、使用 Effect Hook1、useEffect2、useEffect的常见问题2-1 为什么要在 effect 中返回一个函数?2-2 React 何时清除 effect?2-3 effect 中的是否必须要返回?2-4 组件中可以包含多个useEffect一、Hooks简介Hook 是 React 16.8 的新增特性。它可以让你在不编写 class 的情况下使用 state 以及其他的 Re原创 2020-10-17 16:44:13 · 438 阅读 · 0 评论 -
React框架-生命周期
文章目录前言一、挂载阶段挂载阶段常用的三个生命周期二、更新阶段更新阶段常用的两个生命周期三、卸载阶段卸载阶段常用的一个生命周期四、生命周期图解重要阶段完整阶段前言每个组件都包含“生命周期方法”,你可以重写这些方法,以便于在运行过程中特定的阶段执行这些方法。在React中,生命周期有三个阶段1、挂载阶段2、更新阶段3、销毁阶段一、挂载阶段当组件实例被创建并插入 DOM 中时,其生命周期调用顺序如下:constructor()static getDerivedStateFrom原创 2020-10-17 15:46:49 · 525 阅读 · 0 评论 -
React框架-JSX语法
文章目录前言一、你如何理解JSX?1、JSX是对象2、JSX是变量3、JSX可以嵌套4、jsx可以防注入攻击二、JSX注释方式1、单行注释2、多行注释前言JSX是一个 JavaScript 的语法扩展,是javascript XML语法糖。官方建议在 React 中配合使用 JSX,JSX 可以很好地描述 UI 应该呈现出它应有交互的本质形式。JSX 可能会使人联想到模版语言,但它具有 JavaScript 的全部功能。JSX 可以生成 React “元素”。一、你如何理解JSX?1、JSX是原创 2020-10-17 14:25:11 · 322 阅读 · 0 评论 -
React框架-浅谈组件
文章目录前言一、类组件二、无状态组件(函数式组件)三、无状态组件与类组件的区别1、类组件state的特点2、无状态组件(函数式组件)Props前言React 是一个声明式,高效且灵活的用于构建用户界面的 JavaScript 库。使用 React 可以将一些简短、独立的代码片段组合成复杂的 UI 界面,这些代码片段被称作“组件”。一、类组件import React from "react"import {Child1} from "@/components"export default原创 2020-10-17 11:41:00 · 403 阅读 · 0 评论