Next.js: _app.js not receiving 'url' property

Created on 7 Jun 2018  路  1Comment  路  Source: vercel/next.js

Bug report

Describe the bug

_app.js (top component) is no receiving the url property

To Reproduce

export default class MyApp extends App {
  static async getInitialProps ({ Component, router, ctx }) {
    let pageProps = {}

    if (Component.getInitialProps) {
      pageProps = await Component.getInitialProps(ctx)
    }

    return {pageProps}
  }

  render () {
    const {Component, pageProps} = this.props
    return <Container>
      <Component {...pageProps} />
    </Container>
  }
}

Expected behavior

As stated in the documentation and also as happening without an _app.js:

Each top-level component receives a url property with the following API:

pathname - String of the current path excluding the query string
query - Object with the parsed query string. Defaults to {}
asPath - String of the actual path (including the query) shows in the browser
push(url, as=url) - performs a pushState call with the given url
replace(url, as=url) - performs a replaceState call with the given url

System information

  • Version of Next.js: 6.0.3

Most helpful comment

This is not a bug. Hence Deprecated, usewithRouterinstead in the docs.

_app.js is not a top-level page though. It's a special wrapper, just like _document.js. _app.js is responsible for passing through the url property, so when you create a custom one you have to manually handle that. But since it's deprecated we decided against documenting this, as you should use withRouter to get the route properties inside pages.

I'm actually thinking of removing it from the docs altogether now.

>All comments

This is not a bug. Hence Deprecated, usewithRouterinstead in the docs.

_app.js is not a top-level page though. It's a special wrapper, just like _document.js. _app.js is responsible for passing through the url property, so when you create a custom one you have to manually handle that. But since it's deprecated we decided against documenting this, as you should use withRouter to get the route properties inside pages.

I'm actually thinking of removing it from the docs altogether now.

Was this page helpful?
0 / 5 - 0 ratings