JSX 和 vdom 的关系

为何需要 vdom

• vdom 是 React初次推广开来的，结合 JSX
• JSX 就是模板，最终要渲染成 html
• 初次渲染 + 修改 state 后的 re-render
• 正好符合 vdom 的应用场景

React.createElement 和 h

何时 patch

• 初次渲染 - ReactDOM.render(<App/>, container)
• 会触发 patch(container, vnode)
• re-render - setState
• 会触发 patch(vnode, newVnode)

自定义组件的解析

• ‘div’ - 直接渲染 <div> 即可，vdom 可以做到
• Input 和 List ，是自定义组件（class），vdom 默认不认识
• 因此 Input 和 List 定义的时候必须声明 render 函数
• 根据 props 初始化实例，然后执行实例的 render 函数
• render 函数返回的还是 vnode对象