首先,Next.js是个好学校,啊不,是个好框架;
其次,Next.js的文档也不算烂,但确实有点简陋,好多都是undocumented

Next.js有个feature叫做file-system routing:

By default, Next will serve each file in /pages under a pathname matching the filename (eg, /pages/some-file.js is served at site.com/some-file.

你可以设置一个option来turn it off:

// next.config.js
module.exports = {
  useFileSystemPublicRoutes: false,
}

我今天谈论的重点是这个问题:当我在Components/SomeComponenet.jsx里使用router(不论是useRouter还是withRouter),都会报错,错误信息这样的:

Uncaught Error: Invariant failed: You should not use <withRouter(BaseContainer) /> outside a Router

这个报错信息,你一搜,其实是react-router的。也就是说,behind the scene,nextjs一定用了react-router。

所以这二者一结合,就明白了,Components/SomeComponenet.jsx不在router的<Switch>里面。这就不太好办了。至于怎么解决,今天还没有答案。

2019.10.1更新

显然,这他妈根本不是router的问题。这是他妈的context的问题。
现在终于搞清楚了,首先,Nextjs是不支持useContext这个hook的,因此我才他妈的不能够用这个hook获取到context,必须用context consumer!
然后,_app.js在目前(截至到9.0版本)是只能用class component,但可以使用functional component构造的context的。

花了一个多星期!

标签: nextjs, Next.js, router, react-router

添加新评论