React + spring 引導：無法將類型“java.lang.String”的值轉換為所需類型“java.util.Date”

Question

我有一個代碼，我用 React 開發了前端，用 spring 引導開發了后端。

我想通過發送帶有開始日期和結束日期的代碼來在屏幕上看到返回值。

我使用開始日期和結束日期作為 DateTimeFormat。

當我輸入 swagger 文檔中的開始日期和結束日期時，我發現我的代碼可以正常運行。

但是當我在屏幕上輸入這些值時，出現錯誤。

我輸入值的代碼屏幕：

export default function Dashboard() {

    const [startDate,   setStartDate] = useState();
    const [stopDate,    setStopDate] = useState();
    const [plantConfig, setPlantConfig] = useState(14);

    
   const[a1rework,setAfterRework] = useState();
        
   function getAllValues(){
       debugger
        let oeeService = new OeeService()
        oeeService.getA1AfterRework(startDate,stopDate,plantConfig).then(result=>
            setAfterRework(result.data.data));
        
        }



    return (
        <div>

        <DatePicker  dateFormat="yyyy-MM-dd"  selected={startDate}   onChange={(date)=>setStartDate(date)} 
            placeholderText="Başlangıç Tarihi Seçiniz" startDate={startDate} endDate={stopDate}  minDate={startDate}    />
        <DatePicker  selected={stopDate} dateFormat="yyyy-MM-dd"  onChange={(date)=>setStopDate(date)} 
             placeholderText="Bitiş Tarihi Seçiniz" startDate={startDate} endDate={stopDate}  minDate={startDate} />
        <Select   options={plantConfigs} onChange={(plantConfig) => setPlantConfig(plantConfig)}/>
        <Button onClick={getAllValues} content='Check'primary></Button>
        </div>
        
    )
}

react中調用服務的代碼：

 react - service class : 
    
    import axios from "axios";
    
    export default class OeeService{
        getA1AfterRework(startDate,stopDate,plantConfig){
            return axios.get("http://localhost:8080/api/oeeReports/A1AfterReworkRatio?p_start_date="+startDate+"&p_stop_date="+stopDate+"&V_plant_config_num_id="+plantConfig)
        }

輸入值的屏幕：

java中調用的方法：

@GetMapping("/A1AfterReworkRatio")
DataResult<BigDecimal> a1AfterReworkRatio(@RequestParam int V_plant_config_num_id, @RequestParam @DateTimeFormat(pattern = "yyyy-MM-dd") Date p_start_date ,@RequestParam @DateTimeFormat(pattern = "yyyy-MM-dd") Date p_stop_date) {
    return this.oeeReportService.a1AfterReworkRatio( V_plant_config_num_id , p_start_date,  p_stop_date);
}

當我在 swagger 文檔中輸入值時：

當我在 React 中調試代碼時，我注意到開始和結束日期以不同的方式發送到后端，如下所示

java端報錯output：

Failed to convert value of type 'java.lang.String' to required type 'java.util.Date';

我如何通過反應以正確的格式將日期參數發送到 java？

Answer 1

可能下面的代碼可能會解決您的問題：

請務必調試您在后端接收的格式並使用以下代碼更新日期格式

@GetMapping("/A1AfterReworkRatio")
DataResult<BigDecimal> a1AfterReworkRatio(@RequestParam int V_plant_config_num_id, @RequestParam String p_start_date , @RequestParam String p_stop_date) {

r_start_date = new SimpleDateFormat("YYYY-mm-DD").parse(p_start_date);
r_end_date = new SimpleDateFormat("YYYY-mm-DD").parse(p_end_date);

    return this.oeeReportService.a1AfterReworkRatio( V_plant_config_num_id , r_start_date,  r_stop_date);
}