コンテンツへスキップ
ドキュメントエラー`url` は非推奨です

`url` は非推奨です

このエラーが発生する理由

6.xより前のバージョンでは、urlプロパティはすべてのPageコンポーネント(pagesディレクトリ内のすべてのページ)に魔法のように注入されていました。

これが廃止される理由は、物事を予測可能で明示的にしたいからです。どこからともなく現れる魔法のようなurlプロパティは、その目標に貢献しません。

: ⚠️ 場合によっては、React Dev Toolsを使用すると、コード内のどこにもurlを参照していなくても、この警告がトリガーされることがあります。一時的に拡張機能を無効にして、警告が続くかどうかを確認してください。

考えられる解決策

Next 5以降、Next.jsのルーターオブジェクトをページとそのすべての下位コンポーネントに明示的に注入する方法を提供しています。注入されるrouterプロパティは、pathnameasPathqueryなど、urlと同じ値を保持します。

withRouterの使用例を以下に示します

pages/index.js
import { withRouter } from 'next/router'
 
class Page extends React.Component {
  render() {
    const { router } = this.props
    console.log(router)
    return <div>{router.pathname}</div>
  }
}
 
export default withRouter(Page)

urlプロパティの使用をwithRouterに自動的に変更するためのコードモッド(コードからコードへの変換)を提供しています。

このコードモッドと実行方法については、こちらをご覧ください: withRouterを使用する