React学习

react学习笔记

1.安装官方脚手架工具（默认你已经安装node和npm）npmi-gcreate-react-app​​​​​​​2.终端窗口运行create-react-appmydemo(mydemo为自定义项目名)3.等待完成后进入刚刚创建的项目目录运行npmstart4.浏览器打开启动地址5.查看项目基础结构6.一般实际项目的结构图这里借鉴网上大佬的一个项目架构设计，个人觉得比较合适目录简介：assets
Destiny辰·2023-07-19 07:18

react学习笔记——0.引言

本次学习React全家桶包含一下几部分：React基础React-Router：进行路由的库PubSub：消息管理的库Redux：集中式状态管理的库Ant-Design：UI组件库React是什么？用于构建用户界面的js库React是一个将数据渲染位HTML视图的开源JavaScript库React是由FaceBook开发的，并于2013年5月进行了开源原生JS存在的问题：原生的js需要频繁的操作
玄昌盛不会编程·2023-07-18 01:21

react学习笔记（一）

中文官网：https://react.docschina.org/。脚手架创建应用：npxcreate-react-appmy-appcdmy-appnpmstart。快速开始：Next.js：一个流行的、轻量级的框架，用于配合React打造静态化和服务端渲染应用。它包括开箱即用的样式和路由方案，并且假定你使用Node.js作为服务器环境。Gatsby：用React创建静态网站的最佳方式。它让你能
刘赛_c5a1·2023-07-17 21:10

56.React学习笔记.SSR渲染

为什么需要SSR?SSR:Serversiderendering服务端渲染,指的是页面在服务器端已经生成了完成的html页面结构,不需要浏览器解析.单页面富应用,index.html,刚开始基本没东西.首屏加载速度慢,刚开始的时候是空白的,index.html下载之后(前端渲染的时候是浏览器来进行的,可以交给服务端node操作):需要先请求并执行js文件发送ajax获取数据并生成html结构渲染(
_生生不息_·2023-07-17 14:15

开始你的React学习之旅

作为目前较为火爆的前端开发语言，React吸引了大多数前端开发者的目光。技术日新月异，需要我们保持技术敏感性，在一个个小Flag中不断突破自己，让自己每天都能进步1%。下面，收集整理了丰富多彩的学习资料，供大家选择。在雕琢自己技术的路上，你不是独行者，希望每个人都有收获，都能成长...文档资料准备1、ES入门（http://es6.ruanyifeng.com/）React1、React入门教程（
YBFQ_WH·2023-07-15 02:54

React学习笔记（三）Hook使用

一、简介：Hook是React16.8的新增特性。它可以让你在不编写class的情况下使用state以及其他的React特性。ReactHook使得函数组件的功能得到了极大的增强二、Hook代替class的好处：以下是使用ReactHook和类组件同时实现计数器功能的示例：1.使用class:importReact,{Component}from'react';classCounterextend
缘来如此09·2023-07-14 10:05

React学习(一) JSX及元素渲染

JSX全称为JavaScriptXML，字面意思就是在JS中写XML（HTML）格式的代码原理是利用了babel将JSX编译为使用react.createElement()，react本身也是使用这个方法插入节点，但其代码结构非常繁琐，不够直观优雅。使用JSX可以像写html一样写结构，结构直观也提高开发效率。ShoppingListInstagramWhatsApp使用（1）使用JSX创建rea
一羊啦啦·2023-07-14 00:45

【React学习】React更新渲染原理

当我们调用setState之后发生了什么？react经历了怎样的过程将新的state渲染到页面上？一次react更新，核心就是对虚拟dom进行diff，找出最少的需要变化的dom节点，然后对其进行相应的dom操作，用户即可在页面上看到更新。但react作为广泛使用的框架，需要考虑更多的因素，考虑多个更新的优先级，考虑主线程占用时长，考虑diff算法复杂度，考虑性能。。等等，本文就来探讨一下reac
前端开发小司机·2023-07-14 00:44

react学习笔记之三--State

State概述state可以理解成vue中的data，没学过vue也不要紧，就相当于设置一个页面的全局变量，设置的同时也要设置setter，这样就能实现更新state并重新渲染组件，定义的规则如下：const[index,setIndex]=useState(0);这里的index是变量名，setIndex是inedx的set函数，用来进行赋值（只能用这个函数进行赋值，不能使用=来赋值。），最后的
ArmadaDK·2023-06-22 00:33

React学习[二]

React学习[二]React组件介绍组件的创建方式使用函数创建组件使用类创建组件抽离为单独JS文件事件对象事件绑定事件对象有状态组件和无状态组件state的基本使用setState()修改状态事件绑定
致力于前端学习的小李同学·2023-06-20 16:51

React学习笔记（一）DOM、元素

一、一个最简单的react页面：ReactDOM.render(Hello,world!,document.getElementById('root'));它将在页面上展示一个“Hello,world!”的标题。react简单的一个Hello,world看着貌似很复杂，后面将会逐步二、何为DOM元素?首先上段helloworld中用到了一个ReactDOM，那么react中dom是什么意思呢？在网
缘来如此09·2023-06-19 07:25

React学习笔记（二）组件详解（上）

一、组件的概念：当你开始学习React的时候，你会了解到React组件是React应用程序的基本构建块。组件是一个隔离的、可重复使用的代码块，由HTML元素、其他组件或自定义的UI元素组成，组件也就是react的核心思想，如何封装和抽象组件至关重要二、组件的分类：1.函数组件是以函数的形式定义的组件，没有状态或生命周期方法。例如：functionMyComponent(props){returnH
缘来如此09·2023-06-19 07:20

《react 思维导图笔记》

react在react学习中，需要安装两个包react@16.1.1react-dom@16.1.1react这个包是专门用来创建react组件、组件生命周期等等react-dom里面主要封装了和DOM
yk-ddm·2023-06-17 21:43

Web前端-React学习

React基础React概述React是一个用于构建用户界面的JavaScript库。用户界面：HTML页面（前端）React主要用来写HTML页面，或构建Web应用如果从MVC的角度来看，React仅仅是视图层（V）,也就是只负责视图的渲染，而并非提供了完整的M和C的功能。React有如下几个特点：声明式：你只需要描述UI（HTML）看起来是什么样，就跟写HTML一样，React只负责渲染UI，
GY-93·2023-06-15 23:05

React学习[一]

React学习[一]React概述React特点声明式基于组件学习一次，随处可用React基本使用React使用方法说明React脚手架意义脚手架初始化项目npx命令介绍在脚手架中使用reactJSXJSX
七更醉·2023-06-15 22:59

React学习踩坑

问题：JSX元素“h1”没有相应的结束标记解放方案：该问题与VisualStudio代码的语言模式有关。要解决此问题，请将语言模式从“JavaScript”更改为“JavaScripReact”或仅更改为“react”（两个作品中的任何一个）。您可以在VSC底部工具栏更改语言模式。点击它，搜索并选择JavaScriptReact。
七更醉·2023-06-15 22:59

react学习

简介起源于Facebook与传统mvc的关系：轻量级的视图层库，将视图抽象成组件特点声明式设计高效通过虚拟dom，减少真实dom交互灵活适配已知的库或框架jsxjs语法扩展组件代码可复用单向响应数据流减少重复代码，比传统绑定简单虚拟dom真实dom操作消耗性能，react把真实dom转化为js对象树（就是个对象）ps：真实的dom属性太多了，而且频繁的操作视图重绘回流，而且进行了diff算法之后，
六经注我·2023-06-15 17:40

React学习之setState的实现机制

在react中，通过管理状态来实现对组件的管理，通过this.state()来访问state，通过this.setState方法来更新state，当this.setState方法被调用时，react会重新调用render来重新渲染UI。一、setState的全部实现过程：1、enqueueSetState将state放入队列中，并调用enqueueUpdate处理要更新的Component2、如果
青艹止·2023-06-12 14:17

后端开发浅学react

博客笔记来自于学习柴柴老师在b站分享的react学习视频，仅供学习参考，学习视频是来自于b站的：柴柴_前端教书匠，视频链接：React入门到实战(2022全网最新）_哔哩哔哩_bilibili和react
未来很长，别只看眼前·2023-06-11 00:18

React学习之路-准备工作

一、3WReact是什么？React起源于Facebook的内部项目，因为该公司对市场上所有JavaScriptMVC框架，都不满意，就决定自己写一套，用来架设Instagram的网站。做出来以后，发现这套东西很好用，就在2013年5月开源了。为什么要学React？Vue、React、Angular是目前最主流的三大前端框架，React便是其中的佼佼者。在很多的企业招聘信息中，你都会看到React
AnyaPapa·2023-06-11 00:42

React学习之路-目录结构

目录结构node_modules—存放项目依赖包public—存放网站的静态资源文件favicon.icon—网站偏爱图标index.html—主页面（重要）logo192.png—logo图logo512—logo图manifest.json—应用加壳的配置文件robots.txt—爬虫协议文件src—存放源代码，基于ES6规则的React代码App.css—App组件的样式App.js—App
AnyaPapa·2023-06-11 00:10

【前端学习】React学习资料

React是一种开源的JavaScript库，用于构建用户界面。它由Facebook开发并维护，已经成为了当今最流行的前端库之一。与其他框架不同，React主要专注于视图层（View），旨在通过声明式、组件化的方式来构建复杂的UI界面。React的核心思想是将应用程序的UI分解成小且独立的组件，这些组件可以相互嵌套和复用。每个组件都有自己的状态和属性，当这些状态或属性发生变化时，组件会自动重新渲染
后端研发Marion·2023-06-09 12:16

React学习笔记（上）

1、React简介1.1react是什么？React用于构建用户界面的JS库。是一个将数据渲染为HTML视图的开源JS库。React应用程序是由组件组成的。一个组件是UI（用户界面）的一部分，它拥有自己的逻辑和外观。组件可以小到一个按钮，也可以大到整个页面。1.2为什么学？1.原生JS操作DOM繁琐，效率低2.使用JS直接操作DOM,浏览器会进行大量的重绘重排3.原生JS没有组件化编码方案，代码复
山雀~·2023-06-09 05:36

React学习笔记九-高阶函数与函数柯里化

此文章是本人在学习React的时候，写下的学习笔记，在此纪录和分享。此为第九篇，主要介绍高阶函数与函数柯里化。高阶函数，和函数的柯里化，是学习react的拓展，方便以后优化代码，更好的学习react。目录高阶函数案例高阶函数定义函数的柯里化函数柯里化的定义柯里化小案例不用柯里化的写法高阶函数案例先把上一笔记里面的案例，拿出来：这个案例就是，两个输入框分别是用户名和密码，输入用户名和密码，点击登录按
啊啊啊啊啊威·2023-06-07 15:08

《React 学习》

目录React学习基础知识ReactReact对象ReactDOM对象JSXReact学习个人博客地址：基础知识VS-Code开发工具基本使用//常用快捷键!---使用英文状态下的“!”
yk-ddm·2023-06-07 12:07

react学习

reactJSX在JSX语法中，你可以在大括号内放置任何有效的JavaScript表达式。例如，2+2，user.firstName或formatName(user)都是有效的JavaScript表达式。为了便于阅读，我们会将JSX拆分为多行，建议将内容包裹在括号中你可以在if语句和for循环的代码块中使用JSX，将JSX赋值给变量，把JSX当作参数传入，以及从函数中返回JSX你可以通过使用引号，
kiterumer·2023-06-07 00:04

React学习笔记2-初识React

这篇七个点：1环境搭建，2JSX，3组件，4数据流，5生命周期，6React与DOM，7实例1环境搭建1.1引用ReactCDNTitleReactDOM.render(bolala,document.getElementById('example'))1.2利用create-react-app脚手架npminstall-gcnpm--registry=https://registry.npm.t
波拉拉·2023-04-21 06:42

React学习总结2--state与props

React组件是根据props与state这两个参数来计算呈现对应的ui表现。demos源码statestate是组件内部状态的保存。state代表组件ui的最小状态集合，在我们刚接触react的时候很多时候不明白是否应该把变量作为state，其实是有一定的依据条件来判断的：是否是通过props获取？如果是，它就不必为state是否是一个常量，整个生命周期都保持不变？如果是，它就不必为state是
琉璃_xin·2023-04-19 05:31

记录react学习的摘要

记录react学习的摘要启动react项目到项目文件内，用npmstartES6其他内容bind()箭头函数解构和展开Componentscomponents是js类jsx文件的return多个标签用或将其括起来
golitte r·2023-04-15 18:22

react学习笔记

使用create-react-app脚手架搭建项目npxcreate-react-appmy-appcdmy-appnpmstartJSX语法中，如果我们要使用自己创建的组件组件名必须以大写字母开头如App组件的render元素必须写在一个div标签内部有时会影响布局效果。自定义组件可通过引入Fragment占位符替换最外层div标签则组件最外层不会有任何标签包裹。响应式设计思想和事件绑定JSX语
职场丧尸·2023-04-13 11:11

react学习笔记

react学习index.jsimportReactfrom'react';importReactDOMfrom'react-dom';importAppfrom'.
三天两觉_·2023-04-11 11:27

react-组件之间的数据共享

React学习之路021.表单处理2.组件通讯介绍3.props深入了解1.表单处理受控组件的概念：HTML中表单元素时可输入的，也就是有自己的可变状态React中可变状态通常保存在state中，并且只能通过
Lazy-zheng·2023-04-10 00:11

React学习之前言

React是一个采用声明式，高效而且灵活的用来构建用户界面的框架。学习的第一件事，当然是通过它的HelloWorld去了解，在通篇看完官网的井字棋入门教程和阮一峰关于React简单介绍的文章后，对一些概念，总结了一下：1.组件类的首字母需大写，一般来说规范是大写驼峰式。JSX的基本语法规则：遇到HTML标签（以<开头），就用HTML规则解析；遇到代码块（以{开头），就用JavaScript规则解析
高贵的懒羊羊·2023-04-09 19:30

2020年前端学习体系与前端概述

H5UIbootstrapless/stylus模板引擎swiperiscrollselect2工程课程：ES5/6/7git&GitHubnodeJSmongoDBmySQLwebpackgulpbabelVUE微信小程序REACT
海牙kyogre·2023-04-09 00:56

React学习笔记（三）

组件的生命周期React中组件也有生命周期，也就是说也有很多钩子函数供我们使用,组件的生命周期，我们会分为四个阶段，初始化、运行中、销毁、错误处理(16.3之后)初始化在组件初始化阶段会执行constructorstaticgetDerivedStateFromProps()componentWillMount()/UNSAFE_componentWillMount()render()compon
千锋HTML5学院·2023-04-08 15:33

React学习笔记——使用redux调试工具

安装chrome浏览器插件下载工具依赖包npminstall--save-devredux-devtools-extension注：在Chrome中下载了扩展程序后，必须要安装工具依赖后才能生效
小姚同学要继续加油呀·2023-04-05 06:44

react组件卸载调用的方法_好程序员web前端培训分享React学习笔记（三）

好程序员web前端培训分享React学习笔记(三)，组件的生命周期React中组件也有生命周期，也就是说也有很多钩子函数供我们使用,组件的生命周期，我们会分为四个阶段，初始化、运行中、销毁、错误处理(16.3
weixin_39549110·2023-04-03 14:09

React学习笔记

平时使用React比较少，但是最近在搞Lexical编辑器，不得不系统学习一遍React。最近React官方文档进行了升级，体验变得更好了。打算从官方文档开始学习，每天发一篇官方文档的翻译，用一个月的业余时间系统学一遍。言归正传你的第一个UI组件组件是React的核心概念之一，它们是构建用户界面(UI)的基础，这使它们成为开始学习React的理想起点！你将学习以下内容：什么是组件组件在React应
lefex·2023-04-02 05:53

react学习笔记（四）

react学习笔记（四）react-transition-group安装npminstallreact-transition-group引用import{CSSTransition}from'react-transition-group
无聊写写·2023-03-31 02:57

React学习——路由的基础用法

1、创建React项目参考连接：使用yeoman创建React项目2、安装路由cnpmireact-router-Scnpmireact-router-dom-S3、建立如下文件src/index.jsimportReactfrom'react';importReactDOMfrom'react-dom';importAppfrom'./pages/app'ReactDOM.render(,doc
咸鱼str·2023-03-31 02:48

React学习——路由

路由官网中文官网vue-router和react-router的区别：vue-routerreact-router分离式嵌套式排他性（只有一个路由被渲染）包容性（多路由渲染）静态路由动态路由安装ReactRouter被拆分成三个包：react-routerreact-router-domreact-router-native结构BrowserRouter|HashRouter根组件(App)Nav
乙太.·2023-03-31 01:02

React学习五（页面路由）

文章目录一、前端路由二、hash模式三、history模式四、两种路由方式的差异五、React的页面路由模块：react-router-dom的使用1、安装2、实现路由模式的组件（决定路由模式）3、Route组件4、Router组件5、Link和NavLink组件（1）Link组件（2）NavLink组件6、Redirect组件7、Switch组件8、withRouter组件9、404视图六、re
二十一块石头·2023-03-30 22:26

React学习总结

创建react应用npminstallcreate-react-app-ghtml写在了哪个js文件中，就在哪个js文件中引入css。react中引用静态资源也要使用模块化的方式，比如是不行的，要用importabcfrom'/img/a.jpg';react组件中的方法不能直接调用this.state，必须绑定this后才可以image
晴天的枫·2023-03-30 12:26

React学习笔记（一）

react特点用过ReactDOM.render(html,id)的方式渲染页面；其中html是html字符串，多个html节点可以用()包含，里面可以使用js变量，js变量需要用{}包起来；id是挂载元素的实例，可以通过document.getElementById获取；函数封装(组件)：functionClock(props){return({props.date})}除了函数外我们还可以创建
老夫当年也是神一般的少年·2023-03-29 04:53

react学习总结

1.安装npminstall-gcreate-react-appcreate-react-app文件名cd文件名npminstallantd-mobile--save路由跳转npminstallreact-router--savelocalhost:3000打开浏览器2语法注意(1)添加class名,react必须使用className添加(2)想对标签添加样式有三种方法行内样式如:style={
likeli·2023-03-29 03:43

react学习

一：react理念-快速响应，解决快速响应-同步更新变为可中断异不更新。二：react架构调度器（任务优先级）/协调器找变化组件/渲染器将变化组件渲染在页面当项目变得庞大、组件数量繁多时，就容易遇到CPU的瓶颈。JS脚本执行-----样式布局-----样式绘制IO的瓶颈-接口请求慢时间切片将同步的更新变为可中断的异步更新。二：React16架构可以分为三层：Scheduler（调度器）——调度任务
丶温瞳·2023-03-26 19:10

vue, react学习步骤

本文是写给小白的，大佬可以划走哈。无论vue还是react，学习的思路其实都是差不多的，之所以有些人学不懂，可能就是没抓住主线，而导致总体的不连贯如何创建一个工程，并跑起来----官网基本都有，主要就是脚手架的用法。vue3的vite貌似会成为主流如何管理路由，路由的传参方式有哪些，路由守卫过滤的方法如何实现。（vue是现成的，react需要自己实现）如何定义一个组件，组件的变量，事件怎么定义。生
b59a2ae26f20·2023-03-25 18:27

React学习

用了React也有一段时间了，但是对于React的实现过程一直感觉朦朦胧胧，没什么太深的理解。最近抽出一了一点时间学习了一下它的源码，自己按照源码和网上的大神指点，也写了一下，学习到了很多。不能说全部弄懂，但解决了心中的很多疑惑。欢迎大家提出宝贵的意见和建议github:https://github.com/wenhengyi/my-react.git
bingshuihe·2023-03-24 11:43

react学习之路（一些小知识）

1、我遇到的问题react的return中，return出来的内容里，如果有我就是{``}这个问题)这里是利用了{}，告诉react这是一段js代码。然后就可以了。2、react书写写react的时候，使用classTestextandsReact.Component{}而不是varTest=React.createClass({})因为后者在新版本react中被舍弃。3、react中this问题
Rejiu泡泡糖·2023-03-23 14:38

React学习笔记（四）

组件通信父组件与子组件通信父组件将自己的状态传递给子组件，子组件当做属性来接收，当父组件更改自己状态的时候，子组件接收到的属性就会发生改变父组件利用ref对子组件做标记，通过调用子组件的方法以更改子组件的状态,也可以调用子组件的方法..子组件与父组件通信父组件将自己的某个方法传递给子组件，在方法里可以做任意操作，比如可以更改状态，子组件通过this.props接收到父组件的方法后调用。跨组件通信在
千锋HTML5学院·2023-03-22 04:53
上一页 1 2 3 4 5 6 7 8 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他