React
斜光
转战语雀
展开
-
React06:Redux
reduxRedux 是一个独立的 JavaScript 状态管理库https://www.redux.org.cn/安装 Reduxnpm i reduxyarn add redux核心概念理解 Redux 核心几个概念与它们之间的关系state 状态reducer 纯函数store 仓库dispatch 向reducer发起actiongetState 获取statesubscribe 监听stateaction 动作流程首先通过createStore原创 2020-07-23 16:26:51 · 341 阅读 · 0 评论 -
React05:react-router
SPASingle Page Application : 单页面应用,整个应用只加载一个页面(入口页面),后续在与用户的交互过程中,通过 DOM 操作在这个单页上动态生成结构和内容优点:有更好的用户体验(减少请求和渲染和页面跳转产生的等待与空白),页面切换快重前端,数据和页面内容由异步请求(AJAX)+ DOM 操作来完成,前端处理更多的业务逻辑缺点:首次进入处理慢不利于 SEOSPA 的页面切换机制虽然 SPA 的内容都是在一个页面通过 JavaScript 动态处理的,但是还是原创 2020-07-22 23:01:21 · 246 阅读 · 0 评论 -
React04:hooks
hooks 钩子函数用于解决 函数式组件没有办法定义 state 和 生命周期的问题。hooks 主要用于解决 类组件进行逻辑复用极其麻烦的问题hooks 本质就是函数所有的hooks命名规定以use开头React 内置常用 hooksuseState 定义状态let [状态,修改该状态的方法] = useState(初始值);在同一个组件中可以使用 useState 定义多个状态注意 useState 返回的 setState 方法,不会进行对象合并,需要自己将原先属性再传递一次.原创 2020-07-19 11:05:11 · 150 阅读 · 0 评论 -
React03:基础深入以及常用api的使用
文章目录key 的问题PureComponentrefchildrendangerouslySetInnerHTMLkey 的问题在 React ,组件每次更新时,会生成一个 虚拟DOM,和原有的虚拟DOM进行对比。如果是批量生成的一组元素,那React就会根据 key 值去做对比一个列表中的每一项 key 是唯一的,不能重名如果明确列表更新前后,节点顺序不变,可以使用索引值,否则建议使用数据 idPureComponentPureComponent 提供了一个具有浅比较的 shouldC原创 2020-07-16 20:31:37 · 310 阅读 · 0 评论 -
React02:组件与通讯
state 和 setState不使用setState修改state虽然会修改数据,但是并不会重新渲染视图 setState(updater, [callback])updater: 更新数据 function/objectobj中存储的是要修改的状态,setState本身会帮助我门合并状态this.setState({ name: "修改的名字"})使用function时,setState会执行该函数,返回值必须是一个对象,对象中存储要修改的状态this.setStat原创 2020-07-15 20:05:44 · 112 阅读 · 0 评论 -
React01:起手式
文章目录React 是什么?命令式编程 和 声明式编程命令式编程声明式编程如何使用 ReactReactDOM.render dom 渲染React.createElement 虚拟 domJSXbabel插值表达式 {}各种类型内容在插值中的使用输出数据类型条件渲染列表渲染在属性上使用表达式JSX 使用注意事项Fragment 标签**XSS**create-react-app - 脚手架介绍安装与使用安装使用项目目录结构说明命令脚本npm startnpm run testnpm run build组件原创 2020-07-11 17:48:04 · 750 阅读 · 0 评论