Replace deprecated props.url in readme (#4952)

Following #4950

Fix #4716

I'm not sure to understand this part, though :
> Note: in order to programmatically change the route without triggering navigation and component-fetching, use `props.url.push` and `props.url.replace` within a component

Is there a difference between :
```jsx
export default () => <a onClick={() => Router.push('/about')}>About</a>
```

and
 
```jsx
export default withRouter(
  () => <a onClick={() => props.router.push('/about')}>About</a>
)
```
?

readme.md

@@ -365,11 +365,7 @@ Client-side routing behaves exactly like the browser:
 2. If it defines `getInitialProps`, data is fetched. If an error occurs, `_error.js` is rendered
 3. After 1 and 2 complete, `pushState` is performed and the new component is rendered
 
-**Deprecated, use [withRouter](https://github.com/zeit/next.js#using-a-higher-order-component) instead** - 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
+To inject the `pathname`, `query` or `asPath` in your component, you can use [withRouter](#using-a-higher-order-component).
 
 ##### With URL object
 
@@ -518,8 +514,6 @@ Above `Router` object comes with the following API:
 
 The second `as` parameter for `push` and `replace` is an optional _decoration_ of the URL. Useful if you configured custom routes on the server.
 
-_Note: in order to programmatically change the route without triggering navigation and component-fetching, use `props.url.push` and `props.url.replace` within a component_
-
 ##### With URL object
 You can use an URL object the same way you use it in a `<Link>` component to `push` and `replace` an URL.
 
@@ -709,39 +703,44 @@ export default () =>
 Most prefetching needs are addressed by `<Link />`, but we also expose an imperative API for advanced usage:
 
 ```jsx
-import Router from 'next/router'
+import { withRouter } from 'next/router'
 
-export default ({ url }) =>
+export default withRouter(({ router }) =>
   <div>
-    <a onClick={() => setTimeout(() => url.pushTo('/dynamic'), 100)}>
+    <a onClick={() => setTimeout(() => router.push('/dynamic'), 100)}>
       A route transition will happen after 100ms
     </a>
     {// but we can prefetch it!
-    Router.prefetch('/dynamic')}
+    router.prefetch('/dynamic')}
   </div>
+)
 ```
 
 The router instance should be only used inside the client side of your app though. In order to prevent any error regarding this subject, when rendering the Router on the server side, use the imperatively prefetch method in the `componentDidMount()` lifecycle method.
 
 ```jsx
 import React from 'react'
-import Router from 'next/router'
+import { withRouter } from 'next/router'
 
-export default class MyLink extends React.Component {
+class MyLink extends React.Component {
   componentDidMount() {
-    Router.prefetch('/dynamic')
+    const { router } = this.props
+    router.prefetch('/dynamic')
   }
 
   render() {
+    const { router } = this.props
     return (
        <div>
-        <a onClick={() => setTimeout(() => url.pushTo('/dynamic'), 100)}>
+        <a onClick={() => setTimeout(() => router.push('/dynamic'), 100)}>
           A route transition will happen after 100ms
         </a>
       </div>   
     )
   }
 }
+
+export default withRouter(MyLink)
 ```
 
 ### Custom server and routing