{"action":"created","issue":{"url":"https://api.github.com/repos/zeit/next.js/issues/4577","repository_url":"https://api.github.com/repos/zeit/next.js","labels_url":"https://api.github.com/repos/zeit/next.js/issues/4577/labels{/name}","comments_url":"https://api.github.com/repos/zeit/next.js/issues/4577/comments","events_url":"https://api.github.com/repos/zeit/next.js/issues/4577/events","html_url":"https://github.com/zeit/next.js/issues/4577","id":330980566,"node_id":"MDU6SXNzdWUzMzA5ODA1NjY=","number":4577,"title":"tutorial is broken","user":{"login":"dcsan","id":514002,"node_id":"MDQ6VXNlcjUxNDAwMg==","avatar_url":"https://avatars2.githubusercontent.com/u/514002?v=4","gravatar_id":"","url":"https://api.github.com/users/dcsan","html_url":"https://github.com/dcsan","followers_url":"https://api.github.com/users/dcsan/followers","following_url":"https://api.github.com/users/dcsan/following{/other_user}","gists_url":"https://api.github.com/users/dcsan/gists{/gist_id}","starred_url":"https://api.github.com/users/dcsan/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/dcsan/subscriptions","organizations_url":"https://api.github.com/users/dcsan/orgs","repos_url":"https://api.github.com/users/dcsan/repos","events_url":"https://api.github.com/users/dcsan/events{/privacy}","received_events_url":"https://api.github.com/users/dcsan/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":1,"created_at":"2018-06-10T16:03:25Z","updated_at":"2018-06-10T18:02:59Z","closed_at":"2018-06-10T18:02:59Z","author_association":"NONE","body":"this page in the tutorial:\r\n\r\nhttps://nextjs.org/learn/basics/create-dynamic-pages/passing-data\r\n\r\n![image](https://user-images.githubusercontent.com/514002/41203491-50e51d5a-6d0a-11e8-9db4-e242b6842f08.png)\r\n\r\nuses\r\n\r\n       <h1>{props.url.query.title}</h1>\r\n\r\n\r\nbut that throws an error:\r\n\r\nutils.js:26 Warning: the 'url' property is deprecated. https://err.sh/next.js/url-deprecated\r\n\r\nhttps://github.com/zeit/next.js/blob/master/errors/url-deprecated.md\r\n\r\nthe deprecation page suggests some options that I can't seem to get to work\r\n\r\n\r\n```js\r\nconst Story = (props) => {\r\n  console.log(\"props\", props)\r\n  // console.log(\"router\", router)\r\n  const {router} = props\r\n  console.log(\"router\", router)\r\n```\r\n\r\n![image](https://user-images.githubusercontent.com/514002/41203520-d0ed3c94-6d0a-11e8-91d3-4810c2d8d9d8.png)\r\n\r\n\r\nresult: tutorial = broken, throws errors.\r\n\r\n"},"comment":{"url":"https://api.github.com/repos/zeit/next.js/issues/comments/396068881","html_url":"https://github.com/zeit/next.js/issues/4577#issuecomment-396068881","issue_url":"https://api.github.com/repos/zeit/next.js/issues/4577","id":396068881,"node_id":"MDEyOklzc3VlQ29tbWVudDM5NjA2ODg4MQ==","user":{"login":"timneutkens","id":6324199,"node_id":"MDQ6VXNlcjYzMjQxOTk=","avatar_url":"https://avatars2.githubusercontent.com/u/6324199?v=4","gravatar_id":"","url":"https://api.github.com/users/timneutkens","html_url":"https://github.com/timneutkens","followers_url":"https://api.github.com/users/timneutkens/followers","following_url":"https://api.github.com/users/timneutkens/following{/other_user}","gists_url":"https://api.github.com/users/timneutkens/gists{/gist_id}","starred_url":"https://api.github.com/users/timneutkens/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/timneutkens/subscriptions","organizations_url":"https://api.github.com/users/timneutkens/orgs","repos_url":"https://api.github.com/users/timneutkens/repos","events_url":"https://api.github.com/users/timneutkens/events{/privacy}","received_events_url":"https://api.github.com/users/timneutkens/received_events","type":"User","site_admin":false},"created_at":"2018-06-10T18:02:59Z","updated_at":"2018-06-10T18:02:59Z","author_association":"MEMBER","body":"Please keep in mind that while the warning is produced, the functionality remains working perfectly, and it's not going to be removed anytime soon.\r\n\r\nThe reason it's going away is that we want to make things very predictable and explicit. Having a magical `url` property coming out of nowhere doesn't aid that goal.\r\n\r\nThat said, the alternative is very trivial:\r\n\r\n```\r\nimport {withRouter} from 'next/router'\r\nimport Layout from '../components/MyLayout.js'\r\n\r\nconst Page = withRouter((props) => (\r\n    <Layout>\r\n       <h1>{props.router.query.title}</h1>\r\n       <p>This is the blog post content.</p>\r\n    </Layout>\r\n))\r\n\r\nexport default Page\r\n```\r\n\r\nI've updated the specific pages mentioning the magic \"url\" property to now show the \"withRouter\" use case:\r\n\r\nhttps://nextjs.org/learn/basics/create-dynamic-pages/passing-data"}}
{"actor":{"display_login":"timneutkens"}}