submit 후 useRef를 사용하는 자식요소의 input을 어떻게 비워줄 수 있을까 하다가 예전에 함수를 통해 자식 컴포넌트의 state를 보낼 수 있다는 말이 떠올라 적용 해보았다.
const onSubmit = (e,func) => {
const storedLocalProducts =
JSON.parse(localStorage.getItem('product')) || [];
e.preventDefault()
setStoredProduct([productInformation, ...storedLocalProducts]);
dispatchProductInfomation({type:'INITIALIZE_INPUT', value:''})
func()
};
const InputForm = ({...}) => {
const idInput = useRef(null);
const priceInput = useRef(null);
const titleInput = useRef(null);
const descriptionInput = useRef(null);
const clearInput = () =>{
idInput.current.value = ''
priceInput.current.value = ''
titleInput.current.value = ''
descriptionInput.current.value = ''
idInput.current.focus()
}
return (
<>
<Form onSubmit={(event)=>onSubmit(event,clearInput)}>