대머리개발자

formik Lib - Reset은 문제 없다. 본문

개발이야기/프론트

formik Lib - Reset은 문제 없다.

대머리개발자 2023. 3. 17. 22:38
728x90

https://formik.org/docs/examples

formik lib의 문제는 아니였다..

 

리액트에 익숙하지 않는 나의 문제였지. ㅠ

 

프로세스

[클라이언트 등록] -> [클라이언트 뷰] -> [클라이언트 등록]

 

클라이언트 등록 페이지를 다시 open 하는 과정에서

    useEffect(() => {
        formik.handleReset(initForm) // resetForm()
    }, [context.editOpen]);

체크 박스가 Rest이 안 된다. ㅠ 

 

근데 실제 내부 값들은 Reset이 진행됬는데.... 체크박스의 체크가 남아 있던 부분이였다.  아오!!!

Material checkbox

 

"Checkbox" 의 속성 checked을 능동적으로 설정해 주면 된다. 애초에 설정을 하지 않았던 부분이라.... 아오..

 

리액트 .... 프론트..손이 많이 가네. ㅠ..2주남았다.. 완성도를 높이자.!!

 

밸리데이션 해보자 ㅠ

 

전체 그림은 아래와 같다. 간단하다! ㅎ

공통으로 쓰는 속성 및 스타일은 컴포넌트를 만들어서 호출하는 형태로 하면 리소스가 조금 깔끔해진다..

태그 하나하나마다 style이 공통된 부분을 컴포넌트로 그렇게 코드를 만들어야 나야 추후 변경 될 때 컴포넌트 하나만 변경해서 "일괄 변경" 가능하다.

 

formik 설정하구 input 친구에 onChange와 value를 formik으로 설정하면 끝!! 너무 간다s

728x90

'개발이야기 > 프론트' 카테고리의 다른 글

등록 / 수정 페이지 분리?  (0) 2023.03.24
보통의 개발자가 사용하는 axios  (0) 2023.03.20
state 관리 - 새로 고침  (0) 2023.03.17
인증서버 프론트 Vue? React?  (0) 2023.03.16
formik Lib  (0) 2023.03.15