实验环境
- next:
14.0.4
- react:
^18
实验代码
// file: app\page.tsx
'use client';export default function Home() {console.log('test')return (<></>)
}
原因
测试发现创建默认工程上面代码会输出两次test,其原因是为了模拟立即卸载组件和重新挂载组件。帮助开发者提前发现重复挂载造成的Bug,提供的调试机制。
官方文档说明:react 官网 严格模式
解决方案
打开next.config.[ts|js]
文件,
在nextConfig
中增加reactStrictMode
配置项,并设为false