I have the following code in my React application:
import { DateTimePicker, LocalizationProvider } from "@mui/x-date-pickers";
import { AdapterMoment } from "@mui/x-date-pickers/AdapterMoment";
import moment from "moment";
...
const [job, setJob] = useState({
name: "",
outgoingDateTime: moment("2022-09-01T21:00:00"),
});
const handleOutgoingDateTimeChange = (newValue) => { setJob({...job, outgoingDateTime: newValue}); }
...
<LocalizationProvider dateAdapter={ AdapterMoment }>
<Stack spacing={2} direction="row">
<DateTimePicker
label="Outgoing Date and Time"
value={ job.outgoingDateTime }
onChange={ handleOutgoingDateTimeChange }
inputFormat="DD/MM/YYYY HH:mm"
ampm={ false }
renderInput={(params) => <TextField {...params} />} />
</Stack>
</LocalizationProvider>
When I then enter something like 2022-09-13T21:05:00.000Z into the DateTimePicker and then submit and output the result, I have this:
Job Outgoing Date Time: "2022-09-13T20:05:00.000Z"
Which is clearly an hour behind what I've tried to submit which is not what I want as I asked for 21:05 for example. How can I fix this to show the correct time when I submit it?