如何将MUI DesktopDateTimePicker的时间选择器改为DigitalClock（仅桌面端）

要把桌面端的DateTimePicker时间选择视图从模拟时钟改成数字时钟，只需要给DesktopDateTimePicker添加components属性，指定时间选择器组件为DigitalClock即可，步骤如下：

1. 先导入DigitalClock组件：

import { DigitalClock } from '@mui/x-date-pickers/DigitalClock';

2. 修改你的DesktopDateTimePicker代码，添加components配置：

<DesktopDateTimePicker
  {...rest}
  {...field}
  inputRef={ref}
  disabled={disabled}
  inputFormat="dd.MM.yyyy HH:mm"
  // 指定时间选择器为数字时钟
  components={{
    TimePicker: DigitalClock
  }}
  renderInput={(inputProps) => (
    <TextField
      {...inputProps}
      error={!!error}
      onBlur={onBlur}
      helperText={error?.message}
    />
  )}
/>

这样设置后，当你选择完日期进入时间选择环节时，就会显示数字时钟（DigitalClock）而非默认的模拟时钟了。

内容的提问来源于stack exchange，提问作者Petter Jørgensen