게시글 올리고 input 창 비워주는 방법

 

 

버튼을 누르고 (데이터를 submit 하고) 입력된 것 지우기

양방향 바인딩을 사용하자

변경되는 입력값만 수신하는 것이 아니라 입력에 새로운 값을 다시 전달할 수도 있다!! 그래서 프로그램에 따라 입력값을 재설정하거나 입력할 수 있다. 

 

const [enteredDate, setEnteredDate] = useState(new Date());
const [enteredWeight, setEnteredWeight] = useState("");

상태 변경을 관리하는 함수를 활용하면 되는데, 

 

const submitHandler = async (event) => {
    event.preventDefault();

    const inputData = {
      date: new Date(enteredDate),
      weight: enteredWeight,
      photo: enteredPhoto,
      exercise: enteredExercise,
      story: enteredStory,
    };

    const response = await axios.post("/data", inputData);
    props.setData(response.data);
  
    setEnteredDate(new Date());
    setEnteredWeight("");
    setEnteredPhoto("");
    setEnteredExercise("");
    setEnteredStory("");
  };

데이터를 전송해주고, 상태 변경함수를 공백으로 써주고, 

 

 

<label>날짜</label>
            <input
              type='date'
              min='2019-01-01'
              max='2022-12-31'
              value={enteredDate}
              onChange={dateChangeHandler}
            />

 

input에 value로 현재 값을 주면된다. 

 

😃 잘못된 개념 전달이 있다면 댓글 부탁드립니다. 저의 성장에 큰 도움이 됩니다🤓