[hooks] input reset with antd v3

Subin·2020년 8월 21일
1

form

목록 보기
1/1

일반적인 경우

조건
  • react hooks를 사용
  1. 특정 조건이 주어지면 useState의 value를 초기화 시켜주면 된다.
  • 예시
	const [pass, SetPass] = useState(
	pass1: '',
	pass2: ''
	)
	/* onResetPass 활성화되면 pass1, pass2는 초기화가 된다.  */
	const onResetPass = () => {
		setPass({pass1: '', pass2:''})
	}

문제가 되었던 경우 (아마도 ant design 버전이 낮았기 때문?)

문제상황

  1. 회원정보에서 비밀번호를 수정한 뒤 '일반적인 경우'처럼 되지 않는다.
  2. 실제 값은 초기화가 되지만 화면에는 문자가 그대로 보인다.

해결

setFieldsValue 라는 ant design의 prop이 필요했다.

	/* onResetPass 활성화되면 pass1, pass2는 초기화가 된다.  */
	const onResetPass = () => {
		setFieldsValue({pass1: '', pass2:''})
	}

참고 https://ant.design/components/form/v3

profile
정확하게 알고, 제대로 사용하자

0개의 댓글