React
关注
分享
扫一扫
文章平均质量分 81
React 是一个用于构建用户界面的 JAVASCRIPT 库。
React 主要用于构建UI，很多人认为 React 是 MVC 中的 V（视图）。
React 起源于 Facebook 的内部项目，用来架设 Instagram 的网站，并于 2013 年 5 月开源。
No Silver Bullet
业精于勤荒于嬉，行成于思毁于随。
学业由于勤奋而专精，由于玩乐而荒废；德行由于独立思考而有所成就，由于因循随俗而败坏。
——出自（唐）韩愈《进学解》
展开
-
React进阶（十三）：Context
文章目录前言contextType拓展阅读前言Context 提供了一种方式，能够让数据在组件树中传递时不必一级一级的手动传递。一般情况下，数据在组件中，要一级一级的传递，单向数据流，比如Parent组件中的theme值，需要在Item组件中使用，就需要我们从Parent中向下传递， 但当我们有了Context后，我们就不需要一级一级传递了。Parent(theme=red) List(theme=red) Item(theme=red) ThemeCon转载 2021-06-09 10:56:09 · 1473 阅读 · 0 评论 -
React进阶（十二）：HOOK
文章目录前言HOOK函数介绍State hook声明多个 state 变量Effect hook无需清除的 effect需要清除的 effectuseEffect 生命周期useEffect 的第二个参数Context hookHook 规则拓展阅读前言Hook 是 React 16.8.0 的新增特性，React Native 0.59及以上版本支持 Hook。它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性。请注意，要启用 Hook，所有 React 相关的原创 2021-06-09 10:11:58 · 2170 阅读 · 1 评论 -
React进阶（十一）：create-react-app脚手架关闭 eslint 提醒
前言在项目开发过程中，有时候苦恼于eslint的校验规则，例如变量定义为使用、空格等的校验。主要有两种方式可实现关闭eslint提醒。第一种方式在react-scripts依赖包下的config目录找到webpack.config.js配置文件，在webpack.config.js中注释掉以下代码：{ test: /\.(js|mjs|jsx|ts|tsx)$/, ...原创 2020-04-17 10:15:34 · 6976 阅读 · 2 评论 -
React进阶（十）：React 项目启动原理详解
React调用顺序: index.html → index.js → components/组件一般项目创建好后会有二个文件：index.html、index.js现在我们看 my-app文件夹下的public/index.html 和src/index.js的源码，我们可以在这里编写项目代码，但是注意 public/index.html 是启动http服务器的首页，src/index.js...原创 2020-04-16 20:08:07 · 4588 阅读 · 0 评论 -
React进阶（一）：学习资料汇总
React官网（英文基础薄弱的同学，可以去中文网站，不过翻译实在不敢恭维）https://reactjs.org/慕课网免费学习地址（建议按照初级、中级、高级的顺序观看，当然还有其他缴费实战项目，大家各取所需，能薅点羊毛就薅点）：https://www.imooc.com/course/list?c=reactjs...原创 2020-04-01 14:09:33 · 2064 阅读 · 0 评论 -
React进阶（九）：React-Redux
实际项目中，需要权衡是直接使用Redux还是用React-Redux。React-Redux 将所有组件分成两大类：UI 组件（presentational component）和容器组件（container component）UI组件只负责 UI 的呈现，不带有任何业务逻辑；没有状态（即不使用this.state这个变量）；所有数据都由参数（this.props）提供；...原创 2020-03-28 17:46:00 · 1940 阅读 · 0 评论 -
React进阶（八）：state 属性讲解
在《React进阶（六）：props属性》博文中，主要讲解了props的应用场景及应用示例。本篇博文主要梳理state属性的应用场景及应用实例。React 把组件看成是一个状态机（State Machines）。通过与用户的交互，实现不同状态，然后渲染 UI，让用户界面和数据保持一致。React 里，只需更新组件的 state，然后根据新的 state 重新渲染用户界面（不要操作 DOM）。...原创 2020-03-28 13:57:45 · 1843 阅读 · 0 评论 -
React进阶（七）：props 属性介绍
如果需要在组件之间进行传值，那么props属性就起到了这个作用,在React中props和state是两个非常重要的属性。state 和 props 主要的区别在于 props 是不可变的，而 state 可以根据与用户交互来改变。这就是为什么有些容器组件需要定义 state 来更新和修改数据。 而子组件只能通过 props 来传递数据。Note:属性是用于设置默认值，不改变的值使用props...原创 2020-03-28 12:26:00 · 2104 阅读 · 0 评论 -
React进阶（六）：组件生命周期
在组件的整个生命周期中，随着该组件的props或者state发生改变，其DOM表现也会有相应的变化。一个组件就是一个状态机，对于特定地输入，它总返回一致的输出。一个React组件的生命周期分为三个部分：实例化、存在期和销毁时。React应用中，组件加载顺序及生命周期如下图所示：constructor( )constructor是ES6对类的默认方法，通过 new 命令生成对象实例时自动...原创 2020-03-27 14:36:17 · 1924 阅读 · 0 评论 -
React进阶（五）：导航守卫
在《React进阶（三）：路由介绍》博文中，介绍了React路由相关知识，在实际项目开发过程中，路由之间的跳转必定涉及权限、用户是否登陆等限定条件的判定，故需要导航守卫来完成这一事项。...原创 2020-03-24 18:43:12 · 3603 阅读 · 0 评论 -
React进阶（四）：路由介绍
在React SPA项目开发过程中，路由跳转必不可少。本篇博文主要介绍下React中路由相关知识。原创 2020-03-24 18:40:17 · 2087 阅读 · 0 评论 -
React进阶（三）：React项目文件结构介绍
在《React进阶（一）：构建第一个React应用》博文中，介绍了React开发环境搭建及建立第一个React应用。本篇博文继续探讨React项目中合理的文件结构。原创 2020-03-24 18:37:08 · 4689 阅读 · 0 评论 -
React进阶（二）：构建第一个 React 应用
写在前面的话：事务不多或者不紧急，故空闲时间用来充电，鉴于之前自己一直在做Vue开发，现在此基础上接触学习React。大致的学习思路参照Vue学习路线，边学习边总结边实践，形成学习闭环。万事皆有法则，第一次应用React，首先需要环境搭建：Node.js（用于执行js）、npm（包管理器）。具体安装方法请参考博文《Vue进阶（一）：Vue学习资料汇总》中有关环境搭建部分。安装creat...原创 2020-03-24 11:22:03 · 2087 阅读 · 0 评论