如何将 Luxon DateTme 对象转换为日期

编程问答 2022-05-29

问题描述

我正在使用 Material-UI 选择器库构建 DatePicker React，并使用 Luxon 作为适配器。 当我更改日历日期时，我得到一个带有 DateTime 的对象，如下所示：

Image of the DateTime OBJ

我使用的 DatePicker 代码：

<muipickersutilsprovider utils={LuxonUtils}>
              <DatePicker
                className={classes.input}
                disabletoolbar
                variant="inline"
                label="Date"
                format="cccc,LLLL dd"
                helperText=""
                value={date}
                margin="normal"
                onChange={newDate => {
                  handleDateOnChange({ newDate });
                  setDate(newDate);
                }}
                inputvariant="filled"
                fullWidth
                minDate={new Date()}
              />
            </muipickersutilsprovider>

`on change 将我在屏幕截图中分享的 OBJ 还给我，我想得到的是日期。

我正在 console.log(newDate) 中执行 handleDateOnChange 并且没有更多内容可以说明为什么我不分享它。 console.log() 的结果就是你在上面看到的那个。

解决方法

您可以简单地使用 toJSDate()

返回与此 DateTime 等效的 Javascript 日期。

const DateTime = luxon.DateTime;
const dt = DateTime.local();
console.log(dt);
console.log(dt.toJSDate());
<script src="https://cdn.jsdelivr.net/npm/luxon@1.25.0/build/global/luxon.js"></script>

datepickerdatepickerjavascriptluxonmaterial-uireactjsreactjsreactjsreactjs