【資料圖】

前言

我是歌謠 我有個(gè)兄弟 巔峰的時(shí)候排名c站總榜19 叫前端小歌謠 曾經(jīng)我花了三年的時(shí)間創(chuàng)作了他 現(xiàn)在我要用五年的時(shí)間超越他 今天又是接近兄弟的一天人生難免坎坷 大不了從頭再來 歌謠的意志是永恒的 放棄很容易 但是堅(jiān)持一定很酷 微信公眾號(hào)前端小歌謠 關(guān)注公眾號(hào)帶你進(jìn)入前端學(xué)習(xí)交流群

代碼案例

import React, {useState} from "react";import Card from "../UI/Card/Card";import "./LogsForm.css";const LogsForm = (props) => {    const [inputDate, setInputDate] = useState("");    const [inputDesc, setInputDesc] = useState("");    const [inputTime, setInputTime] = useState("");    // 創(chuàng)建一個(gè)響應(yīng)函數(shù)，監(jiān)聽日期的變化    const dateChangeHandler = (e) => {        setInputDate(e.target.value);    };    // 監(jiān)聽內(nèi)容的變化    const descChangeHandler = (e) => {        setInputDesc(e.target.value);    };    //監(jiān)聽時(shí)長的變化    const timeChangeHandler = (e) => {        setInputTime(e.target.value);    };    // 當(dāng)表單提交時(shí)，匯總表單中的數(shù)據(jù)    const formSubmitHandler = (e) => {        // 取消表單的默認(rèn)行為        e.preventDefault();        // 獲取表單項(xiàng)中的數(shù)據(jù)日期、內(nèi)容、時(shí)長        // 將數(shù)據(jù)拼裝為一個(gè)對象        const newLog = {            date: new Date(inputDate),            desc: inputDesc,            time: +inputTime        };        // 當(dāng)要添加新的日志時(shí)，調(diào)用父組件傳遞過來的函數(shù)        props.onSaveLog(newLog);        // 清空表單項(xiàng)        setInputDate("");        setInputDesc("");        setInputTime("");    };    return (                    
                
                    日期                                    
                
                    內(nèi)容                                    
                
                    時(shí)長                                    
                
                    添加                
            
            );};export default LogsForm;