react(15.0.0)
2016-12-18 22:40:08 0 举报AI智能生成
react
作者其他创作
大纲/内容
React
isValidElement
cloneElement
createElement(/src/isomorphic/classic/element/ReactElement.js)创建React元素
type(<div>, defaultProps)
config(ref, key, color, etc....)
children(can be one or more)
PureComponent
Component(/src/isomorphic/modern/class/ReactComponent.js)
setState
ReactUpdateQueue.enqueueSetState
ReactUpdates.enqueueUpdate
ReactCompositeComponent.performUpdateIfNecessary????
this._pendingStateQueue !== null || this._pendingForceUpdate
ReactCompositeComponent.updateComponent
ReactDefaultBatchingStrategy.isBatchingUpdates
dirtyComponents.push(component)
!ReactDefaultBatchingStrategy.isBatchingUpdates
ReactDefaultBatchingStrategy.batchedUpdates(enqueueUpdate, component)
ReactDefaultBatchingStrategy.isBatchingUpdates
callback(a,b,c,d,e)
!ReactDefaultBatchingStrategy.isBatchingUpdates
ReactDefaultBatchingStrategyTransaction.perform()
ReactNoopUpdateQueue.enqueueSetState
forceUpdate
createClass(/src/isomorphic/classic/class/ReactClass.js)
自动绑定 this
初始化 initialState(this.getInitialState)
原型继承父类
合并mixin
初始化 defaultProps(Constructor.getDefaultProps)
减少查找并设置原型时间
PropTypes
createFactory
createMixin
ReactDom
findDOMNOde
render
ReactMount.render
ReactMount._renderSubtreeIntoContainer(/src/renderers/dom/client/ReactMount.js)
_renderNewRootComponent
instantiateReactComponent(初始化组件)
(空)ReactEmptyComponent
typeof node === 'object'
(node.type === string)ReactNativeComponent.createInternalComponent
new genericComponentClass(element)
ReactInjection.NativeComponent.injectGenericComponentClass
(DOM 标签组件)ReactDOMComponent(/src/renderers/dom/shared)
mountComponent
(更新属性)_createOpenTagMarkupAndPutListeners
(如果存在事件则添加事件代理)enqueuePutListener
(样式)CSSPropertyOperations.createMarkupForStyles
(属性)DOMPropertyOperations.createMarkupForProperty
(唯一标识)DOMPropertyOperations.createMarkupForID
(更新子节点)_createContentMarkup
receiveComponent
updateComponent
(更新属性)_updateDOMProperties
删除不必要的旧属性
更新新属性
(更新子节点)_updateDOMChildren(diff)
删除不不要的子节点和内容
更新子节点和内容
getNativeNode
unmountComponent
ReactCompositeComponentWrapper
new ReactCompositeComponentWrapper(element)
(自定义组件)ReactCompositeComponent
mountComponent
挂载组件,初始化
performInitialMount
componentWillMount
inst.state = this._processPendingState(在 WillMount调用
setState时,不会触发re-render, 而是自动提前合并)
setState时,不会触发re-render, 而是自动提前合并)
(递归渲染)ReactReconciler.mountComponent
componentDidMount
receiveComponent
updateComponent
componentWillReceiveProps
var nextState = this._processPendingState(在 WillReceiveProps调用
setState时,不会触发re-render, 而是自动提前合并)
setState时,不会触发re-render, 而是自动提前合并)
shouldComponentUpdate
_performComponentUpdate
componentWillUpdate
inst.state = nextState
_updateRenderedComponent
(递归渲染)ReactReconciler.mountComponent
componentDidUpdate
unmountComponent
componentWillUnmount
子主题
(无状态组件)StatelessComponent
typeof node === 'string' 或 'number'
ReactNativeComponent.createInstanceForText
new textComponentClass(text)
ReactNativeComponentInjection.injectTextComponentClass
(文本组件)ReactDOMTextComponent(/src/renderers/dom/shared)
mountComponent
transaction.useCreateElement ??? 是否使用createElement创建文本标签???
(更新内容)receiveComponent
DOMChildrenOperations.replaceDelimitedText
getNativeNode
unmountComponent
unmountComponentAtNode
version
unstable_batchdUpdates
unstable_renderSubtreeIntoContainer
收藏
0 条评论
下一页
