React学习

React基础笔记---小黑是小白

react学习前置准备学习网站网址种类React中文React中文文档文档ReactRouterReactRouter6中文文档路由ReactRouterReactRouter路由zustandzustand
小黑是小白·2025-07-09 09:02

react学习小记

React：react和vue的不同：vue：双向数据流，他的数据绑定依赖数据劫持，object.defineProperty()中的getter和setter。更形视图是采用MVVMReact:单向数据流,依赖onChange/setState模式，来实现数据双向绑定vue：组件传值方式，props和data来进行传值react：组件传值方式，props和state来进行传值都可以通过写一个ev
LL_wjj·2025-07-04 10:06

React 学习计划

React学习计划前置知识目标熟练掌握HTML、CSS和JavaScript的基础知识。了解ES6+的新特性。
夜游猿·2025-07-04 10:05

React 元素渲染

React学习：元素渲染元素是构成React应用的最小砖块，它描述了你在屏幕上想看到的内容。
小晗同学·2025-06-29 06:10

React动态渲染：如何用map循环渲染一个列表(List)

欢迎来到React学习的第五站！今天，我们要学习一个非常
程序员阿超的博客·2025-06-11 05:54

react学习之旅十二：React动画库react-transition-group

一、安装在终端输入npminstallreact-transition-group--save二、使用react-transition-group插件包含三个库：Transition、CSSTransition以及TransitionGroup。使用时需要引入动画库（引入需要使用的库即可）：import{Transition,CSSTransition,TransitionGroup}from'r
居安_·2025-06-02 05:22

React学习03-react脚手架

文章目录工程化项目脚手架简介创建项目并启动public文件夹src文件夹创建一个Hello组件样式模块化VSCODE插件安装组件的编码化流程工程化项目脚手架简介脚手架用来帮助快速创建基于xxx库的模板项目，包含了所有需要的配置，下载好了所有相关依赖，可以直接运行一个简单的效果。使用脚手架的项目特点有：模块化、组件化、工程化。react脚手架：create-react-app项目的整体技术架构为re
Meowmow·2025-05-26 20:27

React学习教程（开发文档、学习文档）

ReactReact前言官方文档React18中文文档1(国内社区)：https://react.docschina.org/React18中文文档2(官方)：https://zh-hans.reactjs.orgReact18英文文档：https://reactjs.orgReact17英文文档：https://17.reactjs.orgreact概述React是一个用于动态构建用户界面的Js
大卡拉米·2025-05-23 03:35

【react学习】React + Hooks + TypeScript：父组件调用子组件的方法

父组件：importReact,{createRef,useRef}from"react";importChildfrom"./child";constParent=function(){//react17的写法constchildRef=useRef(null);//react18的写法constchildRef=createRef();return({childRef.current.getD
luckyMuses·2025-05-22 10:24

React学习（三）-函数概览

在React中，函数是构建组件和处理逻辑的核心部分。React函数可以分为以下几类：1.函数组件用途：用于定义无状态或使用Hooks的组件。语法：functionMyComponent(props){returnHello,{props.name}!;}特点：函数组件是纯函数，接收props并返回JSX。可以使用Hooks（如useState、useEffect）来管理状态和副作用。2.箭头函数组
香蕉可乐荷包蛋·2025-05-18 08:30

React学习———Redux 、 React Redux和react-persist

ReduxRedux是一个流行的JavaScript状态管理库，通常用于React等前端框架结合使用。Redux的设计思想是让应用的状态变得可预测、可追踪、易于调试和测试。Redux的核心l理念单一数据源：整个应用的状态被存储在一个唯一的Store对象中，所有组件都从这个Store读取数据状态只读：唯一改变状态的方法时触发action，不能直接修改state使用纯函数来执行修改：Reducer处理
邝邝邝邝丹·2025-05-17 16:42

React学习———React Router

ReactRouterReactRouter是React应用中用于管理路由的流行库，它允许你在单页应用（SPA）中实现导航和页面切换而无需重新加载页面。安装npminstallreact-router-dom核心组件使用HTML5的历史记录API（pushState、replaceState和popstate事件）来保持UI与URL的同步。通常包裹在应用的根组件中，提供基于浏览器历史记录的路由功能
邝邝邝邝丹·2025-05-17 04:42

React学习-路由（day5)

前端路由：一个path对应一个组件component。当我们在浏览器中访问一个path的时候，path对应的组件会在页面中进行渲染。简单的使用案例：importReactfrom'react';importReactDOMfrom'react-dom/client';import'./index.css';importAppfrom'./App';importreportWebVitalsfrom
_r0bin_·2025-05-14 19:28

播客专栏 Vol.1｜《TypeScript 与 React 学习指南》值得你认真听完一遍！

播客专栏介绍React+TypeScript系统实战书单精讲《TypeScript与React学习指南》这本书，每期讲一章，帮你从入门走向工程化项目实战。第一
前端达人·2025-05-13 12:36

React学习路线-Deepseek版

前端开发学习路线图（React方向）一、基础阶段：HTML、CSS和JavaScript目标：掌握网页开发的基础三件套。HTML：•学习内容：基本结构、常用标签（,,等）、语义化标签（HTML5）。•资源：◦MDNHTML入门◦书籍：《HTML&CSS设计与构建网站》（JonDuckett）CSS：•学习内容：选择器、盒模型、Flexbox、Grid、响应式设计（媒体查询）。•资源：◦MDNCSS
LuckyLay·2025-05-09 20:57

React学习（day1）

npmcreatevite@latest创建react项目什么是JSX（jsx)是JavaScript和XML（HTML）的缩写，表示在js代码中编写HTML模板结构，它是react中编写UI模板的方式。（js）的语法扩展在jsx中使用js表达式通过大括号语法{}识别，比如常见的变量、函数调用、方法调用等使用引号传递字符串使用javaScript变量函数调用和方法调用使用javaScript对象注
_r0bin_·2025-05-05 22:40

react学习笔记2——基于React脚手架与ajax

使用create-react-app创建react应用react脚手架xxx脚手架:用来帮助程序员快速创建一个基于xxx库的模板项目包含了所有需要的配置（语法检查、jsx编译、devServer…）下载好了所有相关的依赖可以直接运行一个简单效果react提供了一个用于创建react项目的脚手架库:create-react-app项目的整体技术架构为:react+webpack+es6+eslint
qq_58956810·2025-05-03 18:59

react学习笔记，ReactDOM，react-router-dom

react学习1.下载与安装下载npminstall-gcreate-react-app安装npxcreate-react-appxxx推荐npminitreact-appxxxyarncreatereact-appxxx2
跟着阿龙学编程·2025-04-30 15:39

React学习-利用props属性实现导航栏切换

今天学习了react中的props属性，并使用这个属性做了一个导航栏切换的demo效果，分享给大家！最终展示效果1.首先准备目录结构，大家可以根据自己项目情况而定2.容器中的代码importNavfrom"./Nav"importMainFirstfrom"./component/MainFirst"importMainSecondefrom"./component/MainSeconde"imp
小黄不辣几·2025-04-24 19:58

zustand 状态管理库的使用 结合TS

React学习Day10基本用法安装：首先，你需要安装zustand库。npminstallzustand创建一个状态存储：使用createStore函数来创建一个新的状态存储。
珊珊而川·2025-04-18 01:17

React学习（五）React组件属性之三refs

refs的简单使用1.字符串形式的refDocument-->//创建classDemoextendsReact.Component{//展示左侧输入框的数据showData=()=>{console.log(this.refs)const{input1}=this.refsalert(input1.value)}//展示右侧输入框的数据showData2=()=>{const{input2}=t
qq_52551375·2025-04-09 18:02

【React学习笔记】第一章：React入门

1.React介绍中文官网：https://react.docschina.org/英文官网：https://reactjs.org/1.1React是什么react是一个用于构建用户界面的开源JavaScript库。（操作DOM呈现页面）由Facebook的软件工程师JordanWalke创建，于2011年部署于Facebook的newsfeed；2012年部署于Instagram；2013年5
Mae_cpski·2025-04-01 22:56

React学习笔记20

一、React.forward1.1、作用通过ref暴露子组件的DOM1.2、场景说明1.3、语法实现//子组件constInput=forwardRef((props,ref)=>{return})//父组件functionfather_component(){constinputRef=useRef(null)constfocus=(ref)=>{ref.current.focus()}ret
充气大锤·2025-03-19 17:22

React学习笔记16

一、useReducer作用：和useState的作用类似，用来管理相对复杂的状态数据使用：1、定义一个reducer函数（根据不同的action返回不同的新状态）2、在组件中调用useReducer，并传入reducer函数的状态和初始值import{useReducer}from"react"functionreducer(state,action){switch(action.type){c
充气大锤·2025-03-14 00:28

React学习六（Ant Design of React）

文章目录一、特性二、使用过程1、安装2、antd引用三、antd的组件库1、Button按钮2、message消息框（1）Promise接口（2）API（3）以对象的形式传递参数3、Menu组件4、Breadcrumb面包屑5、Layout布局（1）设计规则（2）组件概述（3）代码演示6、Divider分割线7、Grid栅格8、Form表单9、Input组件10、Table表格举例antd是基于A
二十一块石头·2025-03-04 03:45

React学习笔记07

一、自定义Hook函数概念：自定义Hook是以use打头的函数，通过自定义Hook函数可以用来实现逻辑的封装和复用来个小需求：点击toggle按钮时控制div的显示和隐藏不封装直接实现：functionApp(){const[state,set_state]=useState(true)consttoggle=()=>set_state(!state)return({state&&thisisdi
充气大锤·2025-02-28 17:15

react学习：自定义hook

问题导向react自定义hook如果你都有了答案，可以忽略本文章，或去react学习地图寻找更多答案自定义hook（封装）类型：函数作用：逻辑复用，本质是函数，可以多次调用语法：名称以use开头，函数内部可以调用其他的
大神乔伊·2025-02-26 07:40

React学习笔记（组件通信）_千峰教育 react

reduxprinciple-+//定义一个dispatch的方法，接收到动作之后，自动调用constdispatch=(action)=>{changeState(action)renderCount(countState)}```创建createStore方法Reduxprinciple02reduxprinciple-+//定义一个方法，用于集中管理state和dispatchconstcr
m0_54846402·2025-02-20 12:57

React学习笔记04

一、理解组件通信组件通信就是组件间的数据传递，根据组件嵌套关系的不同，有不同的通信方法。在Vue中组件通信是我们组件间传递数据的一种最常用的方法，我们在Vue中使用props来实现父传子，用$emit实现子传父，在React中如何实现呢？1.1、父传子：1、父组件传递数据：在子组件标签身上绑定属性2、子组件接收数据：props的参数functionSon(props){return{props.n
充气大锤·2025-02-19 19:10

React学习笔记

1、React初步认识React构建Web和原生交互界面的库，相较于其它前端框架的优势，具有丰富的生态跨平台支持。1.1、React的开发依赖开发React必须依赖三个库：react：包含react所必须的核心代码；react-dom：react渲染在不同平台所需要的核心代码；babel：将jsx转换成React代码的工具；1.2、VSCode代码片段我们在前面练习React的过程中，有些代码片段
26:28·2025-02-06 04:47

React学习(十)-React中编写样式CSS(styled-components)

虽互不曾谋面,但希望能和你成为笔尖下的朋友以读书,技术,生活为主,偶尔撒点鸡汤不作,不敷衍,意在真诚吐露,用心分享点击左上方,可关注本刊撰文|川川VX-ID:suibichuanji点击文末左下方阅读原文,可看更多内容前言React是一个构建用户界面的js库,从UI=render()这个等式中就很好的映射了这一点,UI的显示取决于等式右边的render函数的返回值.而编写React应用,就是在编写
itclanCoder·2025-02-03 17:20

React学习之相关代码库（三十六）

本章将讲述React代码库的组织，约定，和它的实现方式。如果你想更加关注React，或者说作为开发贡献者，对React进行一些修改，这篇博客或许可以帮到你。当然，我们没必要去过度的关注React应用的约定，因为其中有很多是历史遗留问题，后续版本可能会被pass掉。1.自定义模板系统在Facebook，他们内部人员使用了一个叫做Haste的自定义模板系统，这个系统非常类似CommonJS规范，也使用
77458·2025-02-02 05:42

react学习

react框架的选择低代码、BI前瞻性bs架构，网页客户端去使用react就是用来代替DOM的，dom操作，构建前端界面的react-native直接开发ios，安卓，原生应用虚拟dom，操作react，影响dom，中间人现在的dom和当前的dom做比较看哪个发生了变化，做最小的修改1、虚拟dom2、兼容性3、性能好，避免做一些多余的操作声明式编程：结果为导向命令式编程：过程为导向基于组件开发，组
guhy fighting·2025-01-30 13:00

React 入门第九天：与后端API的集成与数据管理

在React学习的第九天，我集中学习了如何与后端API进行集成。这一步是将静态的React应用转变为动态、可交互的关键。通过与后端通信，我们可以从服务器获取数据、发送用户输入以及处理复杂的业务逻辑。
Caleb-niu·2024-09-08 06:45

React学习12----请求接口数据

react获取服务器APi接口的数据：react中没有提供专门的请求数据的模块。但是我们可以使用任何第三方请求数据模块实现请求数据我们使用axios插件，来请求接口数据使用如下：查看文档：axioshttps://www.npmjs.com/package/axios1、安装axios模块npminstallaxios--save/npminstallaxios--save2、在哪里使用就在哪里引
zhaihaohao1·2024-09-03 03:47

React 入门第六天：理解组件生命周期与效果

在React学习的第六天，我深入探讨了组件的生命周期以及如何使用React的生命周期方法和副作用处理功能。
Caleb-niu·2024-09-01 03:53

React学习day18

Provider批量传递store对象,求和案例react-redux优化容器组件和UI组件整合一个文件。无需自己给容器组件传递store，给包裹一个即可。使用react-redux后也不用自己再检测redux中状态的改变，容器组件可以自动完成这个工作。.mapDispatchToProps也可以简单的写一个对象一个组件要和redux“打交道”要经过几步(1)定义好UI组件—不暴露(2)引入con
我在东软打代码·2024-09-01 03:53

React学习打卡Day05

1.属性props使用let{‘属性名’}=this.props接收属性可接收多个2.属性验证Navbar.protoTypes={验证代码}可以写在对象内部，需要加static关键字importReact,{PureComponent}from'react'importproptypesfrom'prop-types'exportdefaultclassNavbarextendsPureComp
信徒不伤·2024-09-01 02:20

React 入门第七天：探索状态管理与Context API

在React学习的第七天，我深入了解了React的状态管理机制，特别是如何通过ContextAPI来实现跨组件的状态共享。
Caleb-niu·2024-08-28 20:07

03.React学习日记.JSX绑定事件-传递参数

1.原生js事件获取image.png2.组件中方法事件获取发生该事件后，React内部回调函数，会自动传入一个event对象。注意：这两者不是同一种类型的对象，前者为js原生事件对象，后者为React内部合成的事件对象，功能属性基本一样。推荐：箭头函数是最方便的方法：image.pngiage.png注意：事件发生时，React内部调用函数，执行函数onClick.call(undefined,
_生生不息_·2024-08-28 08:57

17.React学习笔记.受控非受控组件

一.refs的使用##React开发模式中，通常情况不需要，也不建议直接操作DOM元素，但是某些特殊的情况，确实需要获取到DOM进行某些操作。管理焦点，文本选择/媒体播放；触发强制动画；集成第三方DOM库。如何创建refs来获取对应的DOM？三种方式。1.1创建方式importReact,{PureComponent,createRef}from'react'exportdefaultclassA
_生生不息_·2024-02-13 16:40

53.React学习笔记.自定义hook练习-scroll

如果我们想在多个组件中获取当前滚轮的位置，并对其进行操作，这时候就需要将逻辑给抽离出来。importReactfrom'react'importuseScrollPositionfrom'../hooks/scroll-position-hook';exportdefaultfunctionCustomScrollPositionHook(){constposition=useScrollPosi
_生生不息_·2024-02-13 12:33

React学习笔记

文章目录1.react脚手架初始化项目2.HooksuseStateuseEffectuseContextuseReduceruseMemouseCallbackuseRef3.APIforwardRef1.react脚手架初始化项目npxcreate-react-appmy-app2.Hooks以use开头的函数，只能在组件或自定义Hook的最顶层调用，不能在条件语句、循环语句或其他嵌套函数内调
张豆豆94·2024-02-12 23:24

19 React学习笔记.AntDesign

AntDesign组件库一.原生React添加className方法{/*原生React中添加class方法*/}我是标题1我是标题2我是标题2)二.第三方库classnames原生React太繁琐，借助第三方库classnames。写法类似Vue中添加类名。{/*classnames库添加class*/}我是标题4我是标题5我是标题6我是标题7我是标题8我是标题9我是标题9三.AntDesign
_生生不息_·2024-02-09 19:41

React前端框架学习 基础知识@stage3---week5--day2

ReactReact学习版本：16.xReact老版本项目：15.xreact官网说17.x会使用的一些技术React应用级脚手架CRAdvaumicreate-react-app【CRA】React官网提供的脚手架脚手架
英俊潇洒美少年·2024-02-06 13:24

React详解（基础知识）——react学习part01

React详解（基础知识）——react学习part01react简介1.官网2.介绍描述3.React的特点4.React高效的原因React的使用1.基本使用1.1创建虚拟DOM的两种方式1.2渲染虚拟
哈喽……·2024-02-03 20:58

React学习记录

大概一年半之前用过React，后来因为工作的原因再也没有接触到React。前端日新月异，室友（也是同行）的提醒，让我有了更强的危机感，模块化开发已是前端基本技能。抛弃各种框架本身的运用来说，更为重要的是它们提供的编程思维。提高自己专业水平，迫在眉睫。我想在上记录自己的一些学习笔记，自己实在太菜。今天在React中看到一个demo。有一段代码如下：constnewItem={text:this.st
一抹春绿误行程·2024-02-03 02:32

React从零基础入门到实战，完成企业级项目简书网站开发

终于追完整部React剧~全部代码可见GitLab项目地址：https://gitee.com/xxxxxl17/jian-shu-react学习笔记：React从零基础入门到实战，完成企业级项目简书网站开发
Xxxxxl17·2024-02-03 01:09

react学习笔记3

一、key与diffing算法react中的key:可以在DOM中的某些元素被增加或删除的时候帮助React识别哪些元素发生了变化。因此你应当给数组中的每一个元素赋予一个确定的标识便于react区分。一个元素的key最好是这个元素在列表中拥有的一个独一无二的字符串。通常，我们使用来自数据的id作为元素的key，当元素没有确定的id时，你可以使用他的序列号索引index作为key。虚拟DOM中key
此间诗意杀人地·2024-01-31 15:34

React 基础学习01

以下是React学习基础，面试中也是常问的点击我获取更多资源1.React类组件中的setState是异步还是同步？
小江的博客·2024-01-30 12:04
上一页 1 2 3 4 5 6 7 8 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他