next.js点击跳转页面的时候，为什么当前页面会重复渲染？

Question

当我使用next-route路由跳转页面的时候就会发生，按理说当前页面不应该重新渲染的，这个如何解决？

pageA：

import {useRouter} from "next/router";
...
const pageA = (props) => {
    console.log('this is page a')
}
const router = useRouter();
...
router.push('/pageB')

pageB:

...
...
const pageA = (props) => {
    console.log('this is page b')
}
const router = useRouter();
...

打印如下：

console.log('this is page a')
console.log('this is page b')

按理说，我从A页面跳转到B页面只会打印B的log，为什么会同时打印两个页面的log呢？那也 就是说明了pageA重新渲染了，就很奇怪

console.log('this is page b')

Answer 1

找到问题原因了：1、是因为客户端数据没有水合到store引起的，2、store变化后会引起useSelector调用，不管数据是否相同
解决1、
将客户端和服务端数据正确水合
解决2、
设置useSelector第2个参数判断是否重复渲染，ture不调用，false调用

详细参考