Material UI - 将“今天”按钮添加到 <DatePicker />

Question

我需要有一个“今天”按钮，如下图所示，位于红色标记区域（或其他地方）的某个位置。我正在使用material-ui v5，我还尝试添加 prop showTodayButton但似乎什么也没做......

Answer 1

2023 更新

正如 @Chaitanya 所提到的，该componentsPropsprop 已被弃用（对于 v5），您应该使用slotProps它。

原答案

bhugo313 提到的错误现已修复，但文档对于如何添加“今天”按钮还不是很清楚。

您需要actionBar通过以下方式提供一个对象componentsProps：

import { DateTimePicker } from "@mui/x-date-pickers/DateTimePicker";

<DateTimePicker
    /* ... other props */
    componentsProps={{
       actionBar: { actions: ["clear", "today", "cancel", "accept"] },
    }}
/>

Answer 2

这是Material UI v5 的错误。此错误有待处理的PR，并且尚未合并。由于 v5 仍处于 RC 阶段，我认为我们应该等待此 PR 被合并。

showTodayButtonprop 在移动日期选择器上运行良好，但不适用于桌面日期选择器。