Next.js:仅在Next.js的服务器端或客户端运行代码

如何编写仅在堆栈的一侧执行的代码:前端或后端

在页面组件中,您只能在服务器端或客户端执行代码,但是请检查window财产。

此属性仅存在于浏览器内部,因此您可以检查

if (typeof window === 'undefined') {
}

并在该块中添加服务器端代码。

同样,您只能通过检查执行客户端代码

if (typeof window !== 'undefined') {
}

JS技巧:我们使用typeof运算符在这里,因为我们无法以其他方式检测到未定义的值。我们做不到if (window === undefined)因为我们会收到“未定义窗口”运行时错误

Next.js作为构建时的优化,也从捆绑软件中删除了使用这些检查的代码。客户端捆绑包将不包含包装在if (typeof window === 'undefined') {}堵塞。

免费下载我的Next.js手册


接下来的更多教程: