CODEWITHSUNDEEP
reactjsserver-side-renderingnext.js
jonathanrz
jonathanrz

Reputation: 4296

Next.js server rendered component window object

I have a component who handles google login through js google api library.

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"
      />
  }
}

Since I am using express as my server, the component is being rendered in the server.

I put some logs and found that the render method is being called in the server and the componentDidMount is never called.

When next.js render the component in the server, is has any callback where I can put some code that will be executed in the client side? Where I would have access to the window object.

Upvotes: 0

Views: 5202

Answers (1)

Craig Kochis
Craig Kochis

Reputation: 883

onComponentDidMount is the correct place to access window, as the component is only mounted client-side (but render happens on both client & server).

Maybe that's not the full component, but it doesn't look like anything in your example exists for this.onGoogleLoginSuccess, since this would refer the the react instance in that context.

Upvotes: 2

Related Questions