Home

Issue: 2672

nuxt component should not render the child when the errors happen

[issue link]

in the nuxt component,the render is below

render(h) {
    if (this.nuxt._redirected) {
      return h('div', [ 'Redirecting to external page.' ])
    }
    // If there is some error
    if (this.nuxt.err) {
      return h('nuxt-error', {
        props: {
          error: this.nuxt.err
        }
      })
    }
    // Directly return nuxt child
    return h('nuxt-child', {
      key: this.routerViewKey
    })
  }

I think if there is some errors, the nuxt-child should not be rendered.
For example, if I have some errors in the asyncData, I will call the error function to show the error page. Sometimes, when the asyncData has errors, the data in the component may be not completely right. So the component should not be rendered.
I think the render function should be like below

render(h) {
    if (this.nuxt._redirected) {
      return h('div', [ 'Redirecting to external page.' ])
    }
    // If there is some error
    if (this.nuxt.err) {
      return h('nuxt-error', {
        props: {
          error: this.nuxt.err
        }
      })
    } else {
      // Directly return nuxt child
      return h('nuxt-child', {
        key: this.routerViewKey
      })
    }
  }

When the errors happen, the child will not be rendered.

This question is available on Nuxt.js community (#c2324)