react-organism icon indicating copy to clipboard operation
react-organism copied to clipboard

Add dynamic import example

Open RoyalIcing opened this issue 8 years ago • 1 comments
trafficstars

  • https://facebook.github.io/react/blog/2017/05/18/whats-new-in-create-react-app.html

Recommended is to load import() in componentDidMount, then set component in state.

With react-organism, could instead just do this in load. Then instead of setting in state, use Component from props.

RoyalIcing avatar Jul 16 '17 14:07 RoyalIcing

Could also follow the next/dynamic system with modules:

import dynamic from 'next/dynamic'

const HelloBundle = dynamic({
  modules: (props) => {
    const components = {
      Hello1: import('../components/hello1'),
      Hello2: import('../components/hello2')
    }
    // you can add / remove components based on props
    return components
  },
  render: (props, { Hello1, Hello2 }) => (
    <div>
      <h1>{props.title}</h1>
      <Hello1 />
      <Hello2 />
    </div>
  )
})

export default () => (
  <HelloBundle title="Dynamic Bundle" />
)

RoyalIcing avatar Aug 09 '17 00:08 RoyalIcing