LOADING...

Preview

Pen ID
Unlock Campus Themeforest adv

 

Code
CSS
body {
  font-family: sans-serif
}
JS
const { createElement, Component} = React
const h = createElement

const Bar = ({foo}) => {foo}

const withFooHOC = Render => props => 

const BarWithFoo = withFooHOC(Bar)

const RenderWithFoo = ({render, ...props}) => render({...props, foo: 'foo'})

const RenderWithFooCE= ({render, ...props}) => h(render, {...props, foo: 'foo'})

const InjectWithFoo = ({Render, ...props}) => 

const Demo = ({children, label, ...props}) => (

{label} {children}

) class App extends Component { constructor() { super() this.state = { renderCount: 0 } } componentDidMount() { window.setInterval(() => { this.setState({renderCount: this.state.renderCount + 1}) }, 1000) } render () { const count = this.state.renderCount // Defining a fn here is same as defining inside the JSX below: const Inline = ({foo}) => {foo} return (

Render Count: {count}

Turn on "Paint Flashing" in Devtools > Rendering to see when components redraw.

{h(BarWithFoo)} { h(withFooHOC(Bar)) }
) } } ReactDOM.render(, document.querySelector('.app'))
Term
Sat, 01/13/2018 - 07:26

Related Codes

Pen ID
Pen ID
Pen ID
Square Adv