這是我在 StackOverflow 上的第一篇文章，如果我沒有正確發布，很抱歉。
這是我的問題，正如標題所說，我想按日期和時間對我的預訂進行排序，但我面臨的問題是預訂按您創建的順序出現。
這是代碼塊：
<Card className="my-4 booking-profile">
<Card.Body>
<Card.Title>
{bookings.map((booking, index) => {
console.log(index);
return (
<ul key={booking.id}>
<li>
<span>
{" "}
Tu reserva: {booking.day}/{booking.month}/{booking.year} a las{" "}
{booking.hour}:{booking.minutes}
</span>
<i
onClick={() => {
deleteBooking(index);
}}
className="fas fa-trash-alt delete"></i>
</li>
</ul>
);
})}
</Card.Title>
</Card.Body>
</Card>
uj5u.com熱心網友回復：
我建議將Array.sort()與您自己的自定義排序器一起使用，例如bookingSorter()
我們將使用 JavaAcript Date物件來幫助我們對值進行排序，為每個預訂創建一個新的 Date 物件，然后將它與 sort 函式中的其他物件進行比較。
const bookings = [
{ year: 2021, month: 12, day: 20, hour: 07, minutes: 30 },
{ year: 2021, month: 11, day: 4, hour: 15, minutes: 20 },
{ year: 2021, month: 11, day: 9, hour: 16, minutes: 20 },
{ year: 2021, month: 11, day: 4, hour: 15, minutes: 25 }
];
function getBookingDate({ year, month, day, hour, minutes}) {
return new Date(year, month - 1, day, hour, minutes);
}
function bookingSorter(a, b) {
return getBookingDate(a) - getBookingDate(b);
}
function formatBooking(booking) {
return getBookingDate(booking).toLocaleString('sv');
}
const sortedBookings = [...bookings].sort(bookingSorter);
console.log('Unsorted bookings:', bookings.map(formatBooking));
console.log('Sorted bookings:', sortedBookings.map(formatBooking)).as-console-wrapper { max-height: 100% !important; top: 0; }uj5u.com熱心網友回復：
您需要對其進行排序，但問題是您無法比較一周中的哪一天，因此您需要為每一天分配值，您可以為該月添加另一種排序并重復相同的程序，如下所示：
const sorter = {
//"sunday": 0, // << if sunday is first day of week
"monday": 1,
"tuesday": 2,
"wednesday": 3,
"thursday": 4,
"friday": 5,
"saturday": 6,
"sunday": 7
}
{bookings.sort(function sortByDay(a, b) {
let day1 = a.day.toLowerCase();
let day2 = b.day.toLowerCase();
return sorter[day1] - sorter[day2];
}).map((booking, index) => { ...
然后對于時間（小時和分鐘），這取決于您是否使用 am pm 格式，但程序是相同的。
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/347636.html
標籤：javascript 反应
上一篇：使用貓鼬更新嵌套陣列內的物件
下一篇：這里如何使用解構？