React
2024-05-28 20:32:42 51 举报AI智能生成
React相关知识点React相关知识点React相关知识点React相关知识点React相关知识点React相关知识点
作者其他创作
大纲/内容
組件
API
setState(object nextState[, function callback])：创建一个state，当是非同步。React会批量处理，重绘完后触发回调
子主题
function createClass({})：创建组件，并返回该组件对象 object PropTypes：验证输入
function getDefaultProps：初始化组件属性
getInitialState
function render：创建模版 document ref：绑定的dom对象
function componentWillMount()：开始插入真实DOM
function componentDidMount()：插入真实DOM完成
function componentWillUpdate(object nextProps, object nextState)：开始重新渲染
function componentDidUpdate(object prevProps, object prevState)：重新渲染完成
function componentWillUnmount()：已移出真实 DOM
function componentWillReceiveProps(object nextProps)：已加载组件收到新的参数时调用
function shouldComponentUpdate(object nextProps, object nextState)：组件判断是否重新渲染时调用
function getInitialState(): object：设置初始state 记
ref：节点实例
组件创建
creatClass
extend React.Compoent
extend React.PureCompoent
已经定义好了shouldUpdateComponent数据变化检测
Children：子节点（undefined、object、Array） props：用于父组件传递值，值是不可变的
children：组件所包涵的子节点，使用React.Children.map遍历
state：状态属性，值是可变的
immutable：持久化数据结构并共享，在节点数据变化时只修改该节点何父节点
工具
容器组件
Redux
Action
action type
index
type
filter
Action 创建函数
Reducer
Store
State
数据流
只能调用 store.dispatch(action)
通过Redux store 调用传入的 reducer 函数
reducer 应该把多个子 reducer 输出合并成一个单一的 state 树
Redux store 保存了根 reducer 返回的完整 state 树
中间件
Selector：使用缓存来优化state变化后渲染视图的性能
redux-saga：异步处理
redux-logger：日志
redux-trunk：处理异步操作
redux-promiss：处理异步操作，actionCreator的返回值是promise
flux
dva
[function dispatch():Action]：
Reducer：同步的，相同输入得出相同结果
Effect：用于异步操作，相同输入可能得出不同结果
Subscription：从订阅的源获取数据
mobx
无需返回新状态
可观测变量
使用 @inject指令进行缓存
视图组件
JSX
事件绑定：react使用事件代理，再document上监听所有事件，通过target触发对应节点的事件
特点
使用大、小写的约定来区分本地组件的类和 HTML 标签。
render内有且只能有一个根标签包涵所有 raodhog：create-react-app的改进
优点
更好的错误提示
mock：基于 require 动态分析的实时刷新
特点
css嵌套在js中
ant
详细文档地址：https://gitee.com/jikold/booturl
或者：https://github.com/dongyanghe/booturl
或者：https://github.com/dongyanghe/booturl
0 条评论
下一页
