'React datePicker (NextJs)
I want to work with datePicker in reactJS(Next JS)
all works normally but when I'm switching my browser to responsive, the icon disappears.
who can help me solve this issue
here is my code
import TextField from '@mui/material/TextField'
import AdapterDateFns from '@mui/lab/AdapterDateFns'
import LocalizationProvider from '@mui/lab/LocalizationProvider'
import DatePicker from '@mui/lab/DatePicker'
import CalendarMonthIcon from '@mui/icons-material/CalendarMonth'
import StaticDatePicker from '@mui/lab/DatePicker'
const [value, setValue] = useState(null)
<LocalizationProvider dateAdapter={AdapterDateFns}>
<StaticDatePicker
displayStaticWrapperAs="desktop"
label="Week picker"
value={value}
onChange={(newValue) => {
setValue(newValue)
}}
renderInput={(params) => <TextField {...params} />}
inputFormat="'Week of' MMM d"
/>
</LocalizationProvider>
Solution 1:[1]
According to the docs there are two versions of the component and the mobile one does not have an icon https://mui.com/components/date-picker/#responsiveness, you can test it there and the responsive one changes
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Luiz Avila |

