react基础
上一篇文章主要是记录了自己是如何创建react项目的，今天则主要是总结一下react中的一个基础入门知识，包括数据定义和绑定、属性绑定、数组循环等等。组件继承和挂载当我们使用脚手架或者命令行创建一个项目时，会自动初始化一个首页，也就是项目的根组件节点，但是在正常的做项目时，是不...
2022-05-17
react 基础
react 组成 一、react 组件基础 1、React 虚拟Dom概念，这是react性能高效的核心算法 2、React 组件，理解react组件化 3、React 多组件嵌套 4、jsx 内置表达式 5、生命周期，纵观整个react的生命周期 2、React 属性与事件 1、State 属性，控制着react...
2022-05-18
react入门案例
现在最热门的前端框架，毫无疑问是 React。上周，基于 React 的React Native发布，结果一天之内，就获得了 5000 颗星，受瞩目程度可见一斑。React 起源于 Facebook 的内部项目，因为该公司对市场上所有JavaScript MVC 框架，都...
2022-05-23
创建react项目
npm搭建React项目React官网提供最简便的方法是使用create-react-app npx create-react-app my-appcd my-appnpm start也可以自己从0开始搭建一个react项目：使用webpack npm安装依赖包安装一个要打包到生产环境的安装包时，使用 npm install --save安装用于开发环境的安装包（例如，linter，测试库等），使用 npm install --...
2022-05-17
快速了解react
概况：通过本篇文章你可以对react的重点有个整体的认识。 关于react是什么，优点，解决什么问题等，网上一大推就不啰嗦了。 了解虚拟DOM的实现，参考这篇文章 [虚拟DOM](https://www.zhihu.com/question/29504639)简单讲，其实就是用一个轻量级的dom结构(用js模拟实现)，来模拟重量级的dom结构，通过比对轻量...
2022-05-23
react优化性能
优化性能AvoidReconciliationReact创建并保存一渲染UI的镜像，通常被称为virtualDOM,当组件的props或者state发生变化时，React会通过对比虚拟DOM和新返回的元素，如果二者不同，则更新DOM。在某些情况下，可以通过shouldComponentUpdate生命周期函数来加速这种对比的过程。此函数在重新渲染前触发，默认返回tr...
2022-05-19
react高级主题
fragment：React 中的一个常见模式是一个组件返回多个元素。Fragments 允许你将子列表分组，而无需向 DOM 添加额外节点。class Columns extends React.Component { render() { return ( <React.Fragment> <td>Hello</td> <td>World</td> </React.Fragment> ); }}短语法：fclass Columns exte...
2022-05-20
react学习日志3
四、state与生命周期1、什么是statestate 与 props 类似，但是 state 是私有的，并且完全受控于当前组件。 属性 props 是外界传递过来的，状态 state 是组件本身的，状态可以在组件中任意修改。组件的属性和状态改变都会更新视图。2、react组件的生命周期每个组件都包含“生命周期方法”，你可以...
2022-06-07
react学习第一天
使用create-react-app生成react脚手架之后，我在上一篇文件已经讲过，这个脚手架所生成的问价以及可以删除的文件夹，那么react的脚手架应该如何使用？首先，app.js做为主要的根组件的入口文件，我们通常是写完组件之后，在app.js文件实现组件的利用如图：其中，我们可以将组件的后缀名，命名为.js文...
2022-05-24
react项目8点优化
本文篇幅较长，将从 编译阶段 -> 路由阶段 -> 渲染阶段 -> 细节优化 -> 状态管理 -> 海量数据源，长列表渲染方向分别加以探讨。一 不能输在起跑线上，优化babel配置,webpack配置为项1 真实项目中痛点当我们用create-react-app或者webpack构建react工程的时候，有没有想过一个问题，我们的配置能否让...
2022-05-21
react 初学第一课
（我是用的是mac ，Windows需要自行配置node.js）在学习react之前了解了相关的几个插件能提高编写速度（sublime 3）。（本人手里有教学视频，有需要的请留下联系方式）安装方式打开编译器，找到View > Show Console复制：import urllib.request,os,hashlib; h = '6f4c264a24d933ce70df5dedcf1dcaee' + 'ebe013ee18cced0ef93d5f746d80ef60'...
2022-05-25
react初入学习笔记
搭建react运行环境 （先装node.js）命令提示符（cmd）1.安装命令react：npm install -g create-react-app2.用cd切换到已创建的文件夹下，（例：g: 回车 cd 001/react 这样）3.创建react项目文件名 create-react-app demo01（这个是文件名，随便取）4.然后再demo01这个项目文件下按住shift+右击 选择“在此处打开命令窗口” 输...
2022-05-15
react实现换肤功能
一.目标 提供几种主题色给用户选择，然后根据用户的选择改变应用的主题色；二.实现原理 1.准备不同主题色的样式文件； 2.将用户的选择记录在本地缓存中； 3.每次进入应用时，读取缓存，根据缓存的信息判断要加载哪个样式文件即可；三.具体实现思路1.准备四个对应不同主题色的样式...
2022-05-19
react实现下载文件
downloadFile=(filePath, filename)=>{ axios.post(filePath, '', { headers: { 'Content-Type': 'application/x-www-form-urlencoded', //请求的数据类型为form data格式 }, 'responseType': 'blob' //设置响应的数据类型为一个包含二进制数据...
2022-05-26
react项目开发入门
在html头部引入react相关js文件<!-- react核心库--><script src="../static/react/react.production.min.js" charset="UTF-8"></script><!-- react dom相关功能--><script src="../static/react/react-dom.production.min.js" charset="UTF-8"></script><!-- jiangJSX语法转换为JavaScript语法--><scr...
2022-05-29
react常用模块介绍
react各个模块：1、node.js自带的模块(原生模块)：https://www.jianshu.com/p/abc72267abfc原生模块的api文档地址：http://nodejs.cn/api/怎么判断引用的模块是核心模块（自带）还是文件模块（npm另安装）？node 内核是提供了判断的方法的，比如你的例子的 crypto 模块// trueprocess.binding('natives').hasOwnProperty('crypto');// falseproc...
2022-05-23
平时写react 小技巧
Stateless function 无状态组件平时写组件用到比较多的就是无状态组件，不但优雅，也是优化react性能的一种手段。 const Greeting = ({ name, style }) => { return <div style={style}>{name}</div> };Array as children 把数组数据渲染出来经常会遇到处理数组数据的情况，可以用下面的方式简单的渲染出来。 render() { ...
2022-05-29
学习react心得及总结
注意学习这个在D盘：小红书第一部分的案例react/new-my-app 小红书第二部分的案例react/make-redux 小红书第三部分的案例react/my-app-higher 并且里面有说且文字react生命周期及其它注意事件/** react中组件里的render函数可以找到组件的this* 在render方法里调用函数时函数是可以找到this的，react中组件里的方法函...
2022-05-25
react的路由权限控制
在使用路由的时候，有的时候我们的界面只能够在登录之后才可以看的到，这个时候就需要使用路由权限控制了找了资料发现一个就是我使用的方法，一个是高阶组件。 原谅菜鸟看不太懂不会使用高阶组件…………首先在路由中做一个私有权限的限制，限制里面的path就是你的私有界面 router.js <Switc...
2022-05-15
react学习记录（一）
一、React是什么 声明式写法（强调结果，命令式编程强调过程） 组件化 一次学习，随处编写（多种应用场景，web程序，原生手机应用，系统应用，命令行工具）二、为什么学习react 大公司加持-facebook 最流行，使用人数最多，被开发者喜爱 简...
2022-05-21
react技术栈实践（2）
本文来自网易云社区作者：汪洋这时候还没完，又有两个问题引出来了。 按照上面的配置，第三方库 antd 竟然也被编译了，导致样式失败。react中，一旦包裹了子组件，子组件没办法直接使用 styleName。第2个问题，还好解决，查了下 react-css-modules 资料，子组件中通过props获取 const template...
2022-05-27
记录一次react相关总结
背景说明：元旦接到一个管理后台的项目，是一个关于自定义专题的项目。通过后台的配置自定义专题，前端根据专题模块进行渲染数据。由于管理后台是react做的前后分离，对于一个后端的我来说写写js也算是浅尝一下。如下记录一下工作中遇到的一些问题，和解决方案。一、父组件调用子组件、以...
2022-05-17
react中的一些基本操作
数据绑定react 中的数据绑定{变量或者表达式} 和vue中的{{}} 一样1.jsx中不能直接绑定对象2.jsx中绑定数组 会将数组的每一项拆分出来3.boolean，null，undef 不会在页面直接进行渲染 但是可以用三元表达式列表渲染react 中的条件渲染依赖于 指定数组会将数组的每一项拆分出来第一种方式 把list中的...
2022-05-23
react怎么设置全局变量
请问，vue中可以通过VUE.prototype.plugin=plugin方式让所有组件中都能直接调用plugin的方法，react中有没有类似的方式？回答：总感觉上面的同学连提问者的意图都没有明白。确实，在 vue 中可以通过 VUE.prototype.plugin=plugin 方式让所有组件中都能直接调用plugin的方法，因为最后咱们会执行 new vue() 的方式来启...
2021-05-04
