【问题标题】:Why can't I access the window in Next.js app '_app.js'? [duplicate]为什么我无法访问 Next.js 应用程序“_app.js”中的窗口? [复制]
【发布时间】:2022-01-10 02:25:06
【问题描述】:

我有一个 Next.js 应用程序,我想在其中加载应用程序,然后使用自定义模式对话框检查网络访问,如果用户断开连接到 Internet,则会显示该对话框。我为我的应用程序设置了一个_app.js 文件来设置上下文提供程序,但无法使用window.navigator 检查网络访问。它会导致错误:“ReferenceError:未定义窗口”。有什么方法可以让我先加载应用程序,以便使用我创建的自定义模式对话框?

_app.js

function MyApp({ Component, pageProps }) {
  console.log(window)
  return <Component {...pageProps} />
}

export default MyApp

页面重新加载时出错:
方法#1

【问题讨论】:

  • 因为,当 node 尝试编译你的 next.js 应用程序时,它找不到window。请注意,window 是浏览器中的全局对象。
  • 在useEffect中使用窗口

标签: javascript reactjs next.js console window


【解决方案1】:

使用useEffect挂载组件时可以访问窗口:

function MyApp({ Component, pageProps }) {
 useEffect(() => {
        console.log(window)
 },[])
 return <Component {...pageProps} />

}

导出默认 MyApp

【讨论】:

  • 重新加载页面时出现错误。
  • 也可以在useEffect外查看: if(window != undefined){ console.log(window) }
  • 什么错误?你能评论错误吗?
  • ReferenceError: 窗口未定义
  • 我在上面更新并添加了图片
猜你喜欢
  • 2018-07-05
  • 1970-01-01
  • 2017-02-02
  • 2021-01-21
  • 2015-03-08
  • 2021-10-07
  • 2020-05-11
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多