monsterooo / blog

and make promises by the hours
MIT License
14 stars 1 forks source link

recompose renderComponent #20

Open monsterooo opened 6 years ago

monsterooo commented 6 years ago

renderComponent 介绍

renderComponent用于包装一个组件为高阶函数,当一个组件需要成为高阶函数和其他高阶函数组合时比较有用,比如和branch组合

renderComponent Flow Type

renderComponent(
  Component: ReactClass | ReactFunctionalComponent | string
): HigherOrderComponent

renderComponent 例子

const { compose, branch, renderComponent } = Recompose;

const Bar1 = () => (<p>Bar1</p>);
const Bar2 = () => (<p>Bar2</p>);

const Foo = compose(
  branch(
    props => props.isShow,
    renderComponent(Bar1),
    renderComponent(Bar2),
  ),
)(({ title }) => (
  <div>{ title }</div>
))

在线DEMO

codepen在线预览