
获得徽章 0
- react-redux 中的 Provider 是一个容器组件,会将外界传入的 props.store 放入 context,然后子组件就可以通过高阶组件 connect 调用 store.dispatch() 和 store.getState() 了。 等人赞过评论7
- React 中的高阶组件是一个函数,传给它一个组件,返回一个新的组件。
它其实就是设计模式中的装饰者模式,目的是代码复用,可以把组件之间可复用的逻辑抽离至高阶组件中。
一个典型的例子就是通过高阶组件实现鉴权逻辑,从而对包裹的组件进行权限验证。展开等人赞过211 - React 中,从 JSX 到页面经过了什么样的过程?
首先,通过 babel 将 JSX 编译成 JS 对象,然后通过 ReactDOM 的 render 方法构造 DOM 树,并插入到页面某个特定元素上。
那么,为什么要先编译成 JS 对象,然后再构造 DOM 树,而不是从 JSX 构造 DOM 树呢?
一方面,JSX 表示的是 UI 的结构和信息,但是它不一定就要渲染到浏览器的页面上,它还可以渲染到其他设备如手机 APP 中。将 react-dom 解耦出来,可以提升 JSX 的复用性。例如,使用 ReactNative,我们可以将相同的 JSX 结构渲染成原生 APP。
另一方面,当数据变化需要更新组件时,可以用比较快的算法直接操作这个 JS 对象,而不用直接操作页面上的 DOM。这样可以尽量减少浏览器重排,从而提升渲染性能。展开等人赞过评论27