React - 随笔分类 - xiaoxustudy

React 【生命周期】三个阶段生命周期函数、不同生命周期详解、图解生命周期

摘要：目录： 1. 三个阶段生命周期函数 2. 不同生命周期详解创建阶段更新阶段卸载阶段 3. 图解生命周期组件在页面上从创建到销毁分为了不同的状态，React 给出了让我们可以调用的生命周期函数。一、三个阶段生命周期函数 React 生命周期主要包含 3 个阶段，分别是初始化阶段、运行中阶段、阅读全文

posted @ 2020-08-09 13:43 xiaoxustudy 阅读(2251) 评论(0) 推荐(0)

React 【State进阶】通过条件判断优化渲染、使用不可变数据、单一数据源、状态提升、使用无状态组件

摘要：目录： 1. 通过条件判断优化渲染 shouldComponentUpdate PureComponent（推荐使用） 2. 使用不可变数据 3. 单一数据源 4. 状态提升 5. 使用无状态组件一、通过条件判断优化渲染例子目前的页面表现如下，点击 “删除” 按钮之后在控制台会输出商品 id 阅读全文

posted @ 2020-07-23 22:10 xiaoxustudy 阅读(1009) 评论(0) 推荐(0)

React 【认识 State】定义state、修改state、state的不可变原则、state的props的区别

摘要：目录： 1. 如何定义 State 2. 如何修改 State 使用 setState setState 是异步的 State 的更新是一个浅合并的过程 3. State 的不可变原则值类型数组类型对象类型 4. State 和 Props 的区别 state props state 和 pr 阅读全文

posted @ 2020-07-20 15:03 xiaoxustudy 阅读(3419) 评论(0) 推荐(0)

React 调试开发插件 React devtools 的使用

摘要：可以在谷歌扩展应用商店里获取这个插件。如果不能访问谷歌应用商店，可以在 npm 网站(www.npmjs.com)上搜索 react-devtools ，然后根据官网指导进行安装。安装插件后，控制台出现 “Components” 跟 “Profiler” 菜单选项。查看版本，步骤：下面介绍 r 阅读全文

posted @ 2020-07-19 14:35 xiaoxustudy 阅读(6908) 评论(0) 推荐(0)

React 【事件处理】React事件和DOM事件、this关键字的处理、向事件处理程序传递参数、向父组件传递参数、React事件机制

摘要：目录： 1. React 事件和 DOM 事件如何在 React 中添加事件 React 事件和传统 DOM 事件处理异同 2. 事件处理中 this 的注意事项方法 1：在 JSX 中使用 bind 方法方法 2：在构造函数中使用 bind 方法方法 3：使用箭头函数 3. 事件处理如何传阅读全文

posted @ 2020-07-18 16:11 xiaoxustudy 阅读(819) 评论(0) 推荐(0)

React 行内样式、引入样式表、CSS Module、CSS管理进阶

摘要：目录： 1. 行内样式 2. 引入样式表 3. CSS Module 4. CSS 管理进阶一、行内样式在 React 元素中，使用行内样式的写法是这样的：行内样式实际上就是 React 元素上的一个属性，属性的值是对象，所有对象的属性名均为 CSS 属性。唯一需要注意的是， CSS 属性写法阅读全文

posted @ 2020-07-16 20:48 xiaoxustudy 阅读(2043) 评论(0) 推荐(0)

React Props、列表渲染、条件渲染

摘要：目录： 1. Props 概念 2. 不同类组件 Props 传递 3. 列表渲染 4. 条件渲染一、Props 概念什么是 props 当 React 元素作为自定义组件，将 JSX 所接受的属性转换为单个对象传递给组件，这个对象被称为“props”。更简单的理解是，props 是父组件传递阅读全文

posted @ 2020-07-15 15:06 xiaoxustudy 阅读(797) 评论(0) 推荐(0)

React 【组件和 JSX 】编写React元素、创建组件、理解JSX、JSX规则、使用Fragments

摘要：目录： 1. 编写 React 元素 2. 创建组件 3. 理解 JSX 4. JSX 规则 5. 使用 Fragments 编写 React 元素打开 index.js，创建一个叫做的 element 的元素，用 h1 标签将先要显示的文字包裹。React 通过 ReactDom.render 阅读全文

posted @ 2020-07-13 15:41 xiaoxustudy 阅读(1047) 评论(0) 推荐(0)

搭建 React 环境

摘要：目录： 1. 前期准备 2. Create React App 3. 工具及插件安装第三方插件安装 bootstrap 执行 eject 4. 在线 React 创建前期准备 1. 安装 Node.js。同时建议安装 nvm，nvm 用于进行 Node 版本的控制。 2. 安装编辑器，比如 V 阅读全文

posted @ 2020-07-12 15:42 xiaoxustudy 阅读(477) 评论(0) 推荐(0)

了解 React

摘要：React 是用于构建用户界面的JavaScript库，并不是一整套的前端方案，React 偏重解决 UI 层。由组件component 来组成一个 React 应用。什么是 Component 比如下面布局中的Header、Sidebar、Content1、Content2 可以看成是一个个的组阅读全文

posted @ 2020-06-09 10:49 xiaoxustudy 阅读(206) 评论(0) 推荐(0)

随笔分类 - React