TimePicker 禁用时如何更改字体颜色 - MUI React

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

我尝试在 TimePicker 禁用时为文本设置另一种颜色,但没有成功。有谁知道如何使用 sx 或 slotProps 更改它?这是我当前的代码。

<TimePicker
          disabled={true} // disabled here
          ampm={false}
          views={['hours', 'minutes', 'seconds']}
          sx={{
            backgroundColor: "#333335",
            font: "white",
            color: "#FFFF",
            textDecoration: "bold",
            input: {
              color: "#FFFF",
              fontSize: "1.4rem",
            }
          }}
          slotProps={{
            popper: {
              sx: {
                "& .MuiList-root": {
                  backgroundColor: "#333335",
                },
                "& .MuiMenuItem-root": {
                  "&.Mui-selected": {
                    backgroundColor: "#04395E",
                    color: "white"
                  },
                  color: "white"
                },
               
              },
            },
          }}
          value={selectedTime}
          onChange={(newTime: any) => setSelectedTime(newTime)}
          timeSteps={{hours: 1, minutes: 1, seconds: 1}}
/>

reactjs material-ui timepicker
1个回答
0
投票

占位符使用

-webkit-text-fill-color
属性设置样式:

<TimePicker
  sx={{
    input: {
      '&.Mui-disabled': {
        WebkitTextFillColor: '#fff'
      }
    }
  }}
/>

演示

© www.soinside.com 2019 - 2024. All rights reserved.