2
Reactフックのマウントされていないコンポーネントでのメモリリークのクリーンアップ
私はReactを初めて使用するので、これを達成するのは非常に簡単かもしれませんが、いくつかの調査を行ったとしても、自分でそれを理解することはできません。これがばかげている場合、私を許してください。 環境 Laravel(バックエンド)アダプターとReact(フロントエンド)アダプターでInertia.jsを使用しています。あなたが慣性を知らないなら、それは基本的に: Inertia.jsを使用すると、クラシックなサーバー側ルーティングとコントローラーを使用して、最新の単一ページのReact、Vue、Svelteアプリをすばやく構築できます。 問題 私は、送信されたときにPOSTリクエストを実行して次のページをロードするフォームを持つ単純なログインページを実行しています。正常に動作しているようですが、他のページではコンソールに次の警告が表示されます: 警告:マウント解除されたコンポーネントでReact状態の更新を実行できません。これは何もしませんが、アプリケーションのメモリリークを示しています。修正するには、useEffectクリーンアップ関数ですべてのサブスクリプションと非同期タスクをキャンセルします。 ログイン中(慣性により作成) 関連コード(関係のない行を避けるために簡略化しました): import React, { useEffect, useState } from 'react' import Layout from "../../Layouts/Auth"; {/** other imports */} const login = (props) => { const { errors } = usePage(); const [values, setValues] = useState({email: '', password: '',}); const [loading, setLoading] = useState(false); …