在 React 中将日历图标添加到 MUI v5 Mobile Date Picker

问题描述 投票:0回答:0

我尝试使用 @mui/x-date-pickers 库来添加移动日期选择器。但是在这个移动日期选择器中没有日历图标。所以我需要为此添加一个日历图标。

我读了他们的文档,他们在这个组件中引入了一个新的 slots 道具。

<MobileDatePicker
 label="Start Date"
 format="MM/dd/yyyy"
 value={new Date(values.startDate)}
 onChange={(e) => handleDateChange(e, 'startDate')}
 slots={{
    textField: customOpenPickerIcon,
 }}
 />

这是我的移动日期选择器的进口。

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

这是我的日历图标组件。

const customOpenPickerIcon = () => {
    return (
      <TextField InputProps={{
        endAdornment: (
          <InputAdornment position="end">
            <Calendar />
          </InputAdornment>
        ),
      }}
      />
    );
  };

我的日期选择器版本是 6.

 "@mui/x-date-pickers": "^6.0.3",

但这不起作用。谁能给个主意?

reactjs material-ui datepicker react-mui
© www.soinside.com 2019 - 2024. All rights reserved.