Implement ssr=false support.

This commit is contained in:
Arunoda Susiripala 2017-04-18 22:21:31 +05:30
parent f2bfcd01b0
commit b5a03a3896
3 changed files with 18 additions and 1 deletions

View file

@ -0,0 +1,3 @@
export default () => (
<p>Hello World 3 (imported dynamiclly) </p>
)

View file

@ -10,12 +10,17 @@ const DynamicComponentWithCustomLoading = dynamic(
loading: () => (<p>...</p>) loading: () => (<p>...</p>)
} }
) )
const DynamicComponentWithNoSSR = dynamic(
import('../components/hello3'),
{ ssr: false }
)
export default () => ( export default () => (
<div> <div>
<Header /> <Header />
<DynamicComponent /> <DynamicComponent />
<DynamicComponentWithCustomLoading /> <DynamicComponentWithCustomLoading />
<DynamicComponentWithNoSSR />
<p>HOME PAGE is here!</p> <p>HOME PAGE is here!</p>
<Counter /> <Counter />
</div> </div>

View file

@ -6,10 +6,16 @@ export default function dynamicComponent (promise, options = {}) {
return class Comp extends React.Component { return class Comp extends React.Component {
constructor (...args) { constructor (...args) {
super(...args) super(...args)
this.LoadingComponent = options.loading ? options.loading : () => (<p>loading...</p>) this.LoadingComponent = options.loading ? options.loading : () => (<p>loading...</p>)
this.ssr = options.ssr === false ? options.ssr : true
this.state = { AsyncComponent: null } this.state = { AsyncComponent: null }
this.isServer = typeof window === 'undefined' this.isServer = typeof window === 'undefined'
this.loadComponent()
if (this.ssr) {
this.loadComponent()
}
} }
loadComponent () { loadComponent () {
@ -27,6 +33,9 @@ export default function dynamicComponent (promise, options = {}) {
componentDidMount () { componentDidMount () {
this.mounted = true this.mounted = true
if (!this.ssr) {
this.loadComponent()
}
} }
render () { render () {