我喜欢在悬停TextField组件时为禁用的元素添加颜色。
这是一个demo

import * as React from "react";

import TextField from "@mui/material/TextField";
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
import { DatePicker } from "@mui/x-date-pickers/DatePicker";

export default function BasicDatePicker() {
  const [value, setValue] = React.useState(null);

  return (
    <LocalizationProvider dateAdapter={AdapterDayjs}>
      <DatePicker
        label="Basic example"
        value={value}
        onChange={(newValue) => {
          setValue(newValue);
        }}
        renderInput={(params) => (
          <TextField
            {...params}
            disabled
            sx={{
              "& .MuiInputBase-input.Mui-disabled": {
                WebkitTextFillColor: "pink"
              },
              "& .MuiInputBase-input.Mui-disabled:hover": {
                color: "green"
              }
            }}
          />
        )}
      />
    </LocalizationProvider>
  );
}

我看到了粉色的文本，但是当用户将其悬停时，它需要变成绿色。有没有办法做到这一点？