Static GitHub Issues

[2672] nuxt component should not render the child when the errors happen

prev: Naming routes
next: Leave transition hook is called on one page when it's in fact another page leaving

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.

<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c2324">#c2324</a>)</em></sub></div>