트러블슈팅: 제출 버튼이 아닌데 제출되는 문제

signUpPage.tsx

export default function Signup() {
  const [part, setPart] = useState<"account" | "info">("account");
  const isAccountPart = part === "account";

  // 임시 핸들러
  const onSubmit: SubmitHandler<User.FormValue> = (data) => {
    console.log(data);
  };
    
  return (
    <FormProvider {...method}>
      <Logo alt="logo" className={logoSignup} />
      <form className={form} onSubmit={handleSubmit(onSubmit)}>
        {/* Section 조건부 렌더링 */}
        {isAccountPart ? <AccountSection /> : <InfoSection />}
        <div className={pagination}>
          <Button
            disabled={isAccountPart}
            variant="outline"
            className={pageButton}
            onClick={() => {
              setPart("account");
            }}
          >
            이전
          </Button>
          {isAccountPart ? (
            <Button
              key="next" // key prop 추가
              type="button"
              disabled={!isAccountPart || !isValid}
              variant="secondary"
              className={pageButton}
              onClick={() => setPart("info")}
            >
              다음
            </Button>
          ) : (
            <Button
              key="submit" // key prop 추가
              type="submit"
              disabled={!isValid}
              variant="secondary"
              className={pageButton}
            >
              완료
            </Button>
          )}
        </div>
      </form>

      <span className={loginText}>
        이미 계정이 있으신가요?{" "}
        <Link href="/login" className={loginLink}>
          로그인
        </Link>
        하러 가기
      </span>
    </FormProvider>
  );
}