如何在材料UI日期选择器反应中仅获取日期？

Question

我使用 Material-UI 选择器库 来获取日期 我只想知道日期 像这样17/07/2021

但是我得到了这样的日期和时间 2021 年 7 月 17 日星期六 12:21:00

const [getDate, setGetDate] = useState(new Date());
<DatePicker
value={selectedDate}
format="MM/dd/yyyy"
minDate={new Date()}
onChange={handleDateChange}
label="Date"
size="small"
required
fullWidth
inputVariant="outlined"
animateYearScrolling

/> 你能帮我吗？

Answer 1

您可以针对您的情况使用像moment这样的格式化程序，如下所示：

import moment from "moment";

...

let date = getDate; // value from your state
let formattedDate = moment(date).format('DD/MM/YYYY');

console.log(date) // before: Sat Jul 17 2021 12:21:00
console.log(formattedDate) // after: 17/07/2021

Answer 2

它似乎与之前的答案有所不同，现在返回对象并且日期在 $d 内，

我使用daysjs，所以格式是这样的，但也可以使用其他格式进行调整

const [value, setValue] = useState(defaultValue)

return (    
  <DatePicker
    value={value}
    onChange={setValue}
  />
  <input type="hidden" name={name} value={dayjs(value.$d).format('YYYY-MM-DD')} />
);

Answer 3

onChange={(event)=>{
                    console.log("date picker - ",event?.target?.value)
                    console.log("date picker event - ",event)
                    console.log("date picker event - ",event["$D"],event["$M"],event["$y"])
                  }}

您可以打印出事件对象并查看日、月、年等数据的位置。我在这里打印了日期、月份和年份。