【React】useEffect 钩子详解

在类组件中,我们通常在生命周期方法中执行这些操作,而在函数组件中,我们使用。钩子是 React 16.8 版本引入的,它允许我们在函数组件中执行副作用操作。如果传递一个空数组作为依赖项,副作用函数只会在组件首次渲染时执行一次。会在每次组件渲染或更新时执行,而返回的清除函数会在组件卸载时执行。发生变化

React实现后台管理系统(二)

使用antd中的Tag组件实现,在components文件夹下新建tag/index.js以及index.css文件。使用mock模拟登录接口返回token,存入localStorage来判断用户是否登录。

一文带你看懂React生命周期和性能优化

在老版本的 React 中,如果组件自身的某个 state 跟其 props 密切相关的话,一直都没有一种很优雅的处理方式去更新 state,而是需要在 componentWilReceiveProps 中判断前后两个 props 是否相同,如果不同再将新的 props更新到相应的 state 上去

前端之React篇

(1)受控组件在使用表单来收集用户输入时,例如等元素都要绑定一个change事件,当表单的状态发生变化,就会触发onChange事件,更新组件的state。这种组件在React中被称为受控组件,在受控组件中,组件渲染出的状态与它的value或checked属性相对应,react通过这种方式消除了组件

React 中 refs 的作用

在 React 中,refs是用来访问和操作 DOM 元素或组件实例的一种方式。通过refs,开发者可以直接与 DOM 进行交互,而无需依赖 React 的状态管理和生命周期方法。虽然在 React 的哲学中,通常建议通过状态和属性来管理 UI,但在某些情况下,使用refs是必要的。在 React

React 增删查改 快速上手

我将以学生管理作为例子,使用react框架和antd样式来实现增删查改的功能gitee项目地址:React 增删查改: 使用react完成一个简单的学生管理增删查改项目环境准备关于后端如果同学不会后端的语言,可以直接使用json-server来做json-server 增删查改 快速上手后续我将会补

react 打包优化开启gzip压缩详细解释(Vue同样适用)

React 打包优化中的 Gzip 压缩是一种减少传输文件大小的常用方法。

React Router 6 中的 6 种路由配置方式:数组、代码分割、对象、函数和服务器加载

React Router 6 是一个强大的路由库,提供了多种配置路由的方式,可以满足不同的应用场景和需求。如可以使用 createBrowserRouter 或 createHashRouter 函数,以数组形式定义嵌套路由、使用 useRoutes hook 和 React.createEleme

在React项目中使用iframe嵌入一个网站

通过以上步骤,你已经成功在React项目中嵌入了百度网站。你可以根据需要调整iframe的宽度、高度等属性,使其更好地适应你的页面布局。

React 中如何使用 Monaco

Monaco 功能非常强大,API 也比较复杂,后面后陆续看看它的 API 如何使用。

【React】详解如何获取 DOM 元素

DOM(文档对象模型)是HTML和XML文档的编程接口。它将文档表示为一个由节点构成的树形结构,每个节点代表文档中的一个部分,比如元素、属性或文本。在React中,虽然大多数操作通过虚拟DOM进行,但有时你仍然需要直接操作实际的DOM节点。

Python与React结合:构建高效前端与后端的综合性技术探索

通过将React与Python结合使用,我们构建了一个集前端展示与后端处理于一体的综合性Web应用。React的组件化开发和高效的性能表现使得前端界面更加流畅和易于维护;而Python的简洁语法和强大功能则为后端处理提供了有力支持。通过合理的项目架构、有效的数据交互以及细致的测试与优化,我们可以开发

前端如何在30秒内实现吸管拾色器?

大家好,我是yma16,本文分享 前端react——实现浏览器页面的吸管拾色器功能。背景在chrome web端快速实现一个页面的取色器功能, 分为两个场景固定区域小范围取色当前页面取色node系列往期文章node_windows环境变量配置node_npm发布包linux_配置nodenode_n

【React】详解classnames工具:优化类名控制的全面指南

classnames工具在React开发中极为实用,通过简洁的方式实现动态类名管理。本文详细介绍了classnames的基础用法和高级应用,包括如何通过对象、数组及其组合来动态添加类名,结合CSS模块和条件渲染实现灵活的样式控制。通过具体案例,如导航菜单和状态切换按钮,展示了classnames在实

【React】常见的 HOC 使用案例

高阶组件是一种强大的模式,可以在 React 中实现代码复用和逻辑抽象。提取和重用跨组件的逻辑控制组件的渲染操作传递给组件的 props管理和注入状态。

通过Umijs从0到1搭建一个React项目

有一阵时间没写react了,今天通过umi搭建一个demo项目复习一下react;umi是一个可扩展的企业级前端应用框架,在react市场中还是比较火的一个框架。

前端宝典之二:React高级用法HOC、Hooks对比、异步组件

本文分文三部分: - HOC高阶组件 higher order component - Hooks 16.8版本后新增的钩子API,手写自定义hooks - 异步组件使用lazy和suspense两个api实现组件代码打包分割和异步加载

前端宝典之三:React源码解析之Fiber架构

本文主要内容:1、React Concurrent2、React15架构3、React16架构4、Fiber架构5、任务调度循环和fiber构造循环区别

React Lazy 的实现原理

动态 import():ES6 的动态 import() 方法允许在运行时按需加载模块,返回一个 Promise。React.lazy:利用动态 import() 方法,React.lazy 可以定义懒加载组件。Suspense:使用 Suspense 组件处理懒加载组件的加载状态,显示占位内容。构

【React】详解 React Router

React Router 是一个为 React 设计的路由库,用于在应用中实现页面导航。它允许你定义不同的 URL 路径,并根据这些路径渲染相应的组件,从而实现页面的切换。创建几个示例组件,用于路由导航。// Home.js。

登录可以使用的更多功能哦! 登录
作者榜
...
资讯小助手

资讯同步

...
内容小助手

文章同步

...
Deephub

公众号:deephub-imba

...
奕凯

公众号:奕凯的技术栈