react.js
关注
分享
扫一扫
文章平均质量分 95
糖同学前端er
这个作者很懒，什么都没留下…
展开
-
react项目总结
本文章主要是源自实际项目开发项目的总结，一些思考是参考了看过的文章，做了一篇总结，demo是跑过的，可以放心食用。目录 一.组件通信1.父组件向子组件通信2.子组件向父组件通信3.跨级组件通信4.兄弟组件通信5.无嵌套关系的组件通信二、避免重复渲染1.隔离独立渲染的子组件2.与渲染无关的变量不用state来管理数据3.批量更新state、合并state4.class组件中使用shouldComponentUpdate5.绑定事件尽量不使用箭头函...原创 2021-01-08 17:11:32 · 1515 阅读 · 0 评论 -
围观“33行代码的React”
在奇舞周刊的公众号上看到文章，学习了一下外国工程师的用33行实现的React，他实现的React主要涉及虚拟DOM生成、差异比较、真实DOM的渲染，主要可使用m()函数，用于创建虚拟DOM，m.render()，用于DOM挂载与渲染。以下为学习注解，可先看如何调用，再反过来看实现：<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta name="robots" content原创 2020-05-26 17:44:34 · 226 阅读 · 0 评论 -
react之context、portals、HOC、render props
1.Context定义： 一种可以在组件之间共享值的方式，不必显示通过组件树逐层传递props。用法： 使用React.createContext创建一个context，再使用Provider将值传递给子组件，在子组件中指定contextType=创建的context，React 会往上找到最近的 theme Provider，使用时通过this.context即可获取...原创 2019-11-12 15:56:13 · 344 阅读 · 0 评论 -
react生命周期小demo
/* 生命周期三个状态： Mounting：组件挂载，已插入真实DOM Updating：组件更新，正在被重新渲染 Unmounting：组件移出，已移出真实DOM 生命周期四个阶段： 创建、实例化、更新、销毁 */ var Demo = React.createClass({/*--------------------------------原创 2017-06-23 14:54:28 · 592 阅读 · 0 评论 -
react笔记-数据载体state/props/context
1.state state应该称为内部状态或局部状态，react组件可以在构造函数中初始化内部状态，可以通过this.setState方法更新内部状态，还可以使用this.state获取内部状态，内部状态的操作与react事件系统配合可以实现用户交互的功能。 import React, { Compone原创 2017-09-13 17:57:58 · 557 阅读 · 0 评论 -
redux简易demo
demo 简介通过组件的事件改变 store 中的 state 值，进而改变视图，同时通过调用接口来渲染数据。地址：https://github.com/MaTonna/demoForRedux使用的依赖react-redux：管理 react 当中的 state，创建一个集中管理的 storeredux-thunk： redux 的中间件，使 action 返回一个函数，组件派发事件时...原创 2018-11-22 15:26:08 · 1902 阅读 · 0 评论