useEffectを使ってwatchHasGitHubRepoがfalseになったときにリセットする

1 files changed, 5 insertions, 1 deletions

diff --git a/src/SignUpForm3.tsx b/src/SignUpForm3.tsx
index bfd71d0..e3b347d 100644
--- a/src/SignUpForm3.tsx
+++ b/src/SignUpForm3.tsx
@@ -1,4 +1,5 @@
 import './SignUp.css'
+import { useEffect } from 'react';
 import { useForm } from 'react-hook-form'
 import { zodResolver } from "@hookform/resolvers/zod"
 import { useLocation, Navigate, useNavigate } from 'react-router-dom';
@@ -47,7 +48,10 @@ export const SignUpForm3Main = () => {
     (reposData.map((json: any) => (json['name']))) :
     []
 
-  // TODO: watchHasGitHubRepo が false の場合は gitHubUsername と repoName が '' になって欲しい
+  useEffect(() => {
+    setValue('gitHubUsername', '')
+    setValue('repoName', '')
+  }, [watchHasGitHubRepo])
 
   // form1, form2 のデータがない場合は form1 にリダイレクトする
   if (formData === null) {