[React]useFormStatus 펜딩상태를 체크할 수 있다.

원래는 axios 상태값이나 redux로 상태 변경해서 처리했던건데, 이게 되네?

실험기능.

 

실험적인 기능이긴한데, axios나 tanstack query같은 라이브러리를 이용해서 통신시 작동충돌이 없을지 모르겠다.

import { useFormStatus } from "react-dom";
import action from './actions';

function Submit() {
  const status = useFormStatus();
  return <button disabled={status.pending}>Submit</button>
}

export default function App() {
  return (
    <form action={action}>
      <Submit />
    </form>
  );
}