utterances-bot commented 2 years ago

3. 타입스크립트로 리액트 상태 관리하기 · GitBook

kkn1125 commented 2 years ago

항상 참고하면서 익히고 있습니다. 좋은 글 감사합니다. 😀 onChange에 마우스를 올려도 이벤트에 대한 타입이 표시되지 않습니다.

위 이미지 처럼 이벤트에 대한 타입이 없이 나타납니다. 어느부분을 봐야하는 걸까요...

qhqjq1890 commented 1 year ago

저도 위와 동일하게 표시되길래 위와 같이 props를 직접 적어줘서 확인했습니다.

ByoungSuk commented 1 year ago

혹시 강의 처럼 React.FormEvent 이런 타입이 아니라 React.FormEventHandler 타입으로 나온 경우

import React, { useState } from 'react';

type MyFormProps = { onSubmit: (form: { name: string; description: string }) => void; };

const MyForm: React.FC = ({ onSubmit }) => { const [form, setForm] = useState({ name: '', description: '', });

const { name, description } = form;

const onChange = (e: React.ChangeEvent) => { const { name, value } = e.target; setForm({ ...form,

});

}; const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); onSubmit(form); setForm({ name: '', description: '', }); };

return ( <form onSubmit={(e) => handleSubmit(e)}>

  <input name='description' value={description} onChange={onChange} />
  <button type='submit'>등록</button>
</form>

); };

export default MyForm;

underdarks commented 1 year ago

타입스크립트에 대해서 너무 재밋게 배우고 있습니다! 감사합니다 ㅎ

velopert / react-tutorial