rsnext/test/integration/client-navigation/pages/nav/shallow-routing.js

import { Component } from 'react'
import Link from 'next/link'
import Router from 'next/router'

let getInitialPropsRunCount = 1

const linkStyle = {
  marginRight: 10,
}

export default class extends Component {
  static getInitialProps({ res }) {
    if (res) return { getInitialPropsRunCount: 1 }
    getInitialPropsRunCount++

    return { getInitialPropsRunCount }
  }

  getCurrentCounter() {
    const { url } = this.props
    return url.query.counter ? parseInt(url.query.counter) : 0
  }

  increase() {
    const counter = this.getCurrentCounter()
    const href = `/nav/shallow-routing?counter=${counter + 1}`
    Router.push(href, href, { shallow: true })
  }

  render() {
    return (
      <div className="shallow-routing">
        <Link href="/nav">
          <a id="home-link" style={linkStyle}>
            Home
          </a>
        </Link>
        <div id="counter">Counter: {this.getCurrentCounter()}</div>
        <div id="get-initial-props-run-count">
          getInitialProps run count: {this.props.getInitialPropsRunCount}
        </div>
        <button id="increase" onClick={() => this.increase()}>
          Increase
        </button>
      </div>
    )
  }
}