Как отключить ввод календаря с клавиатуры в Material-UI DatePicker в ReactJS

Чтобы отключить ввод календаря с клавиатуры в Material-UI DatePicker в ReactJS, вы можете попробовать следующие методы:

Метод 1: использование свойства inputProps

import React from 'react';
import DatePicker from '@material-ui/lab/DatePicker';
const CustomDatePicker = () => {
  return (
    <DatePicker
      inputProps={{ readOnly: true }}
// Other props...
    />
  );
};
export default CustomDatePicker;

Метод 2: использование реквизита «отключено»

import React from 'react';
import DatePicker from '@material-ui/lab/DatePicker';
const CustomDatePicker = () => {
  return (
    <DatePicker
      disabled
      // Other props...
    />
  );
};
export default CustomDatePicker;

Метод 3. Использование CSS для отключения поля ввода

import React from 'react';
import DatePicker from '@material-ui/lab/DatePicker';
import { makeStyles } from '@material-ui/core/styles';
const useStyles = makeStyles({
  disabledInput: {
    pointerEvents: 'none',
    opacity: 0.6,
    // Other styles...
  },
});
const CustomDatePicker = () => {
  const classes = useStyles();
  return (
    <DatePicker
      className={classes.disabledInput}
// Other props...
    />
  );
};
export default CustomDatePicker;

Эти методы позволяют отключить ввод календаря с клавиатуры в Material-UI DatePicker в ReactJS. Вы можете выбрать метод, который лучше всего соответствует вашим потребностям.