React
aoshisen
这个作者很懒,什么都没留下…
展开
-
react_06-react_redux相关
reduxRedux 是一个独立的 JavaScript 状态管理库https://www.redux.org.cn/安装 Reduxnpm i reduxyarn add redux核心概念理解 Redux 核心几个概念与它们之间的关系state 状态reducer 纯函数store 仓库action 动作state 对象通常我们会把应用中的数据存储到一个对象树(Object Tree) 中进行统一管理,我们把这个对象树称为:statestate 是只读的这里需要注原创 2020-09-30 10:14:38 · 148 阅读 · 0 评论 -
react_05 路由相关以及综合实践
路由相关以及综合实践render 和重定向import React, { Fragment, useState } from "react"import { Redirect, Route,Switch } from "react-router-dom"import IndexView from "./view/indexView"import JoinView from "./view/joinView"import Page404 from "./view/page404"import P原创 2020-09-23 10:26:20 · 109 阅读 · 0 评论 -
React_04 useEffect实现类组件的生命周期和自定义Hooks以及react-router入门
hooks && Router本节课重点内容函数式组件函数式组件,本质就是一个常规函数,接收一个参数 props 并返回一个 reactElement函数式组件中没有this和生命周期函数,不能使用 string ref使用函数式组件时,应该尽量减少在函数中声明子函数,否则,组件每次更新时都会重新创建这个函数React hooks(钩子)React hooks 是React 16.8中的新增功能。它们使您无需编写类即可使用状态和其他React功能常用 hookuseS原创 2020-09-21 14:00:24 · 1245 阅读 · 0 评论 -
React_03 react 一些零碎的API
文章目录key 的问题PureComponentrefchildrendangerouslySetInnerHTMLkey 的问题在 React ,组件每次更新时,会生成一个 虚拟DOM,和原有的虚拟DOM进行对比。如果是批量生成的一组元素,那React就会根据 key 值去做对比一个列表中的每一项 key 是唯一的如果列表中发生顺序等操作变化,key 一定要用数据的idPureComponentPureComponent 提供了一个具有浅比较的 shouldComponentUpdate 方原创 2020-09-20 16:31:44 · 87 阅读 · 0 评论 -
React_02 组件的生命周期以及组件间通信
state 和 setStatesetState(updater, [callback])updater: 更新数据,里面的才参数可以是对象,也可以是函数,但是函数必须返回一个对象,对象里面的是需要修改的属性的值callback: 更新成功后的回调 function异步:react通常会集齐一批需要更新的组件,然后一次性更新来保证渲染的性能浅合并 Objecr.assign()调用 setState 之后,会触发生命周期,重新渲染组件示例: import React, { Componen原创 2020-09-19 13:31:10 · 204 阅读 · 0 评论 -
利用React 和ant-design 搭建cnode项目的随笔
文章目录利用React 和ant-design 搭建cnode项目的随笔利用create-react-app搭建一个React项目利用React 和ant-design 搭建cnode项目的随笔利用create-react-app搭建一个React项目利用npm包管理器创建React项目npm init react-app cnode-hooks进入项目然后删除多余的文件#进入到主要的工作目录cd cnode/src #删除多余的文件这里我为了方便给这个命令定义了一个别名(rmR原创 2020-09-16 17:54:31 · 143 阅读 · 0 评论 -
React_01了解基本的React 渲染原理以及一些注意事项
文章目录React 是什么?命令式编程 和 声明式编程如何使用 React基于浏览器的模式babelJSX插值表达式各种类型内容在插值中的使用输出数据类型列表渲染条件渲染在属性上使用表达式JSX 使用注意事项基于自动化的集成环境模式 - create-react-app - 脚手架介绍安装与使用安装npmyarn使用项目目录结构说明命令脚本npm startnpm run testnpm run build组件类式组件函数式组件props 和 stateprops 与 state 的区别React 中的事件原创 2020-07-12 16:04:09 · 142 阅读 · 0 评论