react之路由

功能:让用户从一个视图(组件)导航到另一个视图(组件) 前端路由是一套映射规则,在React中,是URL路径与组件的对应关系 使用React路由简单来说,就是配置路径和组件 路由的使用 1、安装路由 npm i -S react-router-dom 2、相关组件 Router组件:包裹整个应用,一 ... »

ypSharing

react之redux状态管理

1、传统MVC框架的缺陷 模型(model)-视图(view)-控制器(controller)的缩写 V即View视图:用户看到并与之交互的界面。 M即Model模型是管理数据:很多业务逻辑都在模型中完成。在MVC的三个部件中,模型拥有最多的处理任务。 C即Controller控制器:接受用户的输入 ... »

ypSharing

react之组建通信

父组件与子组件通信 父组件将自己的状态传递给子组件,子组件当做属性来接收,当父组件更改自己状态的时候,子组件接收到的属性就会发生改变 父组件利用ref对子组件做标记,通过调用子组件的方法以更改子组件的状态,也可以调用子组件的方法 父组中定义ref引用 import React,{Component, ... »

ypSharing

react之组件生命周期

四个阶段 初始化 运行中 销毁 错误处理(16.3以后) 初始化 constructor static getDerivedStateFromProps() componentWillMount() / UNSAFE_componentWillMount() render() componentDi ... »

ypSharing

react之事件处理

1、事件绑定 React 元素的事件处理和 DOM 元素的很相似,但是有一点语法上的不同: React 事件的命名采用小驼峰式,而不是纯小写。 onClick onChange 使用 JSX 语法时你需要传入一个函数作为事件处理函数,而不是一个字符串。 onClick={this.fn} 类组件与函 ... »

ypSharing

react之组件数据挂在方式

1、属性(props) 组件间传值,在React中是通过只读属性 props 来完成数据传递的。 props:接受任意的入参,并返回用于描述页面展示内容的 React 元素。 import React, { Component, Fragment } from 'react' import Reac ... »

ypSharing

react之四种组件中DOM样式设置方式

1、行内样式 想给虚拟dom添加行内样式,需要使用表达式传入样式对象的方式来实现 行内样式需要写入一个样式对象,而这个样式对象的位置可以放在很多地方 例如:render函数里、组件原型上、外链js文件中 注意:这里的两个括号,第一个表示我们在要JSX里插入JS了,第二个是对象的括号 <p style ... »

ypSharing

react 中间件相关的一些源码解析

零、随便说说中间件 在react的使用中,我们可以将数据放到redux,甚至将一些数据相关的业务逻辑放到redux,这样可以简化我们组件,也更方便组件抽离、封装、复用,只是redux不能很好的处理异步,当我们获取接口数据的时候,redux就满足不了我们的需要。然后,中间件就出来了,使用中间件可以满足 ... »

this-day