`url` 已弃用
此错误发生的原因
在 6.x 版本之前,`url` 属性会自动注入到每个 `Page` 组件(`pages` 目录中的每个页面)中。
弃用此属性的原因是我们希望使事物更可预测和明确。凭空出现一个神奇的 `url` 属性无助于实现这一目标。
注意:⚠️ 在某些情况下,即使您在代码中没有引用 `url`,使用 React Dev Tools 也可能会触发此警告。请尝试暂时禁用该扩展,看看警告是否仍然存在。
可能的解决方法
自 Next 5 以来,我们提供了一种将 Next.js 路由器对象显式注入到页面及其所有后代组件中的方法。注入的 `router` 属性将包含与 `url` 相同的值,例如 `pathname`、`asPath` 和 `query`。
以下是使用 `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)我们提供了一个 codemod(代码到代码转换)来自动将 `url` 属性的使用更改为 `withRouter`。
您可以在此处找到此 codemod 和有关如何运行它的说明:使用 `withRouter`
这有帮助吗?