Next.js服务器呈现组件窗口对象

问题描述：

我有一个组件通过js google api库处理Google登录。Next.js服务器呈现组件窗口对象

export default class Index extends React.Component { 
    componentDidMount() { 
    window.onGoogleLoginSuccess = this.onGoogleLoginSuccess.bind(this) 
    } 

    render() { 
    return (
     <div 
      className="g-signin2" 
      data-onsuccess="onGoogleLoginSuccess" 
      data-theme="dark" 
     /> 
    } 
}

由于我使用express作为我的服务器，组件正在服务器中呈现。

我把一些日志，发现渲染方法正在服务器中调用，componentDidMount永远不会被调用。

当next.js在服务器中呈现组件时，是否有任何回调，我可以放置一些将在客户端执行的代码？我可以在哪里访问窗口对象。

它从来没有被调用过（componentDidMount）?.根据next.js docs'这个生命周期方法只会在客户端执行'。你是否检查组件是否实际安装在客户端？ –

@PieroDivasto它永远不会被调用。由于在服务器端调用了渲染方法，我认为组件正在安装在服务器端。我的问题是，如果有任何回调方法，我可以把我的代码，将在客户端执行时，该组件被安装在服务器端。 – jonathanrz

答

onComponentDidMount是访问window正确的位置，作为成分是仅安装客户端（但呈现发生两个客户端&服务器上）。

也许这不是完整的组件，但它看起来不像this.onGoogleLoginSuccess中的任何东西，因为this会引用该环境中的反应实例。

我没有提供实现，因为它不是必需的例子，但我已经实现了这个方法。我的代码正在工作，但我添加了一个快速服务器在路由中进行一些验证，现在onComponentDidMount不再被调用。 – jonathanrz

我发现问题是由我的js文件中的错误引起的，因为Chrome无法解析文件，所以它停止执行并且从未执行onComponentDidMount。我会接受你的回答，因为那是因为她确信问题不在next.js流程中。谢谢你的帮助。 – jonathanrz

Next.js服务器呈现组件窗口对象

相关推荐