我不確定如何比較這兩種型別。hive.inspection_date 像 2022-06-10 一樣在我的 console.log 上回傳，當我嘗試將它與 DateTwo 進行比較時，它沒有比較，因為我的 console.log 正在回傳（2022 年 5 月 31 日星期二 17:06:57 GMT-0400（東部夏令時間））。我不知道如何轉換這些，以便他們可以比較，我可以提醒用戶。有什么建議么？
import React, { useState } from "react"
import Alert from 'react-bootstrap/Alert'
const DisplayAlert= (props) => {
const [show, setShow] = useState(true);
let dateTwo = new Date();
return (
<>
{console.log(dateTwo)}
{props.hives.map((hive)=> {
if (hive.inspection_date > dateTwo){
return
}
else if (hive.inspection_date <= dateTwo, show){
// if (show) {
{console.log(hive.inspection_date)}
return (
<Alert variant="danger" onClose={() => setShow(false)} dismissible key={hive.id}>
<Alert.Heading >Oh snap! You got are running behind an Inspection for Hive number: {hive.hive_number} Inspection date of: {hive.inspection_date}</Alert.Heading>
</Alert>
);
// }
}
// return <button onClick={() => setShow(true)}>Show Alert</button>;
}
)}
</>
)
}
export default DisplayAlert;
uj5u.com熱心網友回復：
你hive.inspection_date回傳的是一個字串，而不是一個數字；您可以使用將其轉換為日期new Date(hive.inspection_date)；然后使用格式將兩個日期物件轉換為數字→ new Date(...)
import React, { useState } from "react"
import Alert from 'react-bootstrap/Alert'
const DisplayAlert= (props) => {
const [show, setShow] = useState(true);
let dateTwo = new Date();
// This needs to be converted to a `number`
// if you want to use numeric comparison
return (
<>
{console.log(dateTwo)}
{props.hives.map((hive)=> {
const inspection_date = new Date(hive.inspection_date);
// Generate a new Date object... Then convert it to a number
if (inspection_date > dateTwo){
return
}
else if (inspection_date <= dateTwo, show){
// if (show) {
{console.log(inspection_date)}
return (
<Alert variant="danger" onClose={() => setShow(false)} dismissible key={hive.id}>
<Alert.Heading >Oh snap! You got are running behind an Inspection for Hive number: {hive.hive_number} Inspection date of: {new Date(inspection_date)}</Alert.Heading>
</Alert>
);
// }
}
// return <button onClick={() => setShow(true)}>Show Alert</button>;
}
)}
</>
)
}
export default DisplayAlert;
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/484147.html
標籤：反应