为什么useEffect会运行两次？

2022年3月发布的React 18改变了useEffect() 的默认行为。

一开始我都没意识到，看了React 18发布的帖子，顺便埋了很多新功能。

如果你的应用程序在更新到React 18后表现得很奇怪，useEffect 的默认行为改变为运行2次。

只是在开发模式下，但这是每个人构建应用程序的模式。

而只是在严格模式下，但这现在是使用create-react-app 或 Next.js 构建的应用程序的默认情况。

这是有原因的。

这不是你的代码的问题--这就是现在React的工作方式。

禁用这种行为的唯一方法是禁用严格模式。

严格模式很重要，所以这是一个临时的变通办法，直到你能修复这个变化带来的任何问题。

你可以在Next.js中通过添加选项

reactStrictMode: false

在你的next.config.js 文件中添加选项。

在create-react-app ，你可以在你的index.js文件中，删除StrictMode高阶组件，从：

import React, { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';

import App from './App';

const rootElement = document.getElementById('root');
const root = createRoot(rootElement);

root.render(
  <StrictMode>
    <App />
  </StrictMode>
);

到

import React from 'react';
import { createRoot } from 'react-dom/client';

import App from './App';

const rootElement = document.getElementById('root');
const root = createRoot(rootElement);

root.render(
  <App />
);

还有一件事!⚠️ ✋

在一月底，我将组织网络开发训练营。

这是一个为期10周的同学会在线课程，我将指导你成为一名Web开发人员。

这不仅仅是 "一个课程"。它是我每年组织一次的大型活动。

我们将从零开始，学习网络开发的基础知识，HTML，CSS，JavaScript，Tailwind，Node.js，然后我们将学习React，JSX，如何使用PostgreSQL，Astro，Next.js，Prisma等等

在前10周结束时，你将知道如何创建网站和网络应用程序，我将为你解锁Bootcamp的第二阶段：你将获得Bootcamp毕业生专属的大量项目，所以你可以按照我的指示建立像带有认证的私人区域，克隆Twitter YouTube Reddit等流行网站，创建电子商务网站，等等。

因为一旦你掌握了基础知识，你只能通过在真正的、令人兴奋的项目上工作来学习。