如何从datepicker传递字段日期作为Api url参数

Question

我正在从一个API中获取数据，该API将日期作为参数
此日期来自react的材料选择器，日期的格式应该是yyyy-MM-dd，但是当我使用日期选择器选择日期时，它将日期传递为

星期二2021年10月12日00:00:00 GMT+0000(格林威治标准时间)我希望datpiecker发送的日期是我需要的格式:yyyy-MM-dd这是我的代码的一个PRT:

import React, { useState, useCallback, useEffect } from "react";
import DateFnsUtils from "@date-io/date-fns";
import {DatePicker, KeyboardDatePicker,MuiPickersUtilsProvider,} from "@material-ui/pickers";
function ExchangeRate() {

const [date, setDate] = useState(moment().format("YYYY-MM-DD"));

useEffect(() => {


function getExchangeRates(base, currencyCode) {

const url = `https://data.fixer.io/api/${date}?&base=USD`;

return fetch(url)
.then((res) => res.json())
.then(handleAPIErrors)
.then((res) => res.rates);
return (


</CSelect>




<MuiPickersUtilsProvider utils={DateFnsUtils}>

<KeyboardDatePicker
autoOk
label="Material Date Picker"
format="yyyy-MM-dd"
animateYearScrolling
value={date}
onChange={date => setDate(date)}
/>

</MuiPickersUtilsProvider>

Answer 1

您可以在api URL中使用moment设置日期格式，如下所示:

const url = `https://data.fixer.io/api/${moment(date).format("YYYY-MM-DD")}?&base=USD`;

或者，如果您想在状态中始终以该格式存储日期，您可以更改onChange事件如下:

onChange={date => setDate(moment(date).format("YYYY-MM-DD"))}

在KeyboardDatePicker组件中，formatprop只定义了日期在该组件中如何显示，而不是如何在onChange事件中使用它。