更改 DateRangePicker Reactjs MUI 的默认日期

【问题标题】：Change default date of DateRangePicker Reactjs MUI更改 DateRangePicker Reactjs MUI 的默认日期
【发布时间】：2022-01-07 08:26:03
【问题描述】：

DateRangePicker 默认显示今天的日期。是否可以将特定日期设置为默认日期。

输入文本字段的高度不会随内联 css 变化。

 <FormControl>
    <LocalizationProvider
      dateAdapter={AdapterDateFns}
      sx={{
        BackgroundColor: "red",
      }}
    >
      <DateRangePicker
        startText="Start date"
        endText="End date"
        value={value}
        onChange={(newValue) => {
          setValue(newValue);
        }}
        renderInput={(startProps, endProps) => (
          <React.Fragment>
            <TextField
              {...startProps}
              
            />
            <Box sx={{ mx: 2 }}> to </Box>
            <TextField {...endProps}  />
          </React.Fragment>
        )}
      />
    </LocalizationProvider>
  </FormControl>

【问题讨论】：

标签： reactjs material-ui react-daterange-picker

【解决方案1】：

DateRangePicker 组件实际上是用边框突出显示今天的日期，以指示今天的日期。它将突出显示在 value 属性中传递的选定值，其中主色作为主题的背景色属性。

在这个codesandbox 中，你可以看到我设置了上一个日期的状态，它被突出显示。

【讨论】：

value prop 正在接受显示为选定范围的日期数组。
是的，确实value 接受带有日期的数组作为范围，因为这是一个范围日期选择器。您可以发送带有一个日期值的数组以在范围选择器中选择该值。如果要显示范围，请发送带有两个值的数组。如果您将它们存储在不同的变量中，那么在上面的代码中以这种格式传递它可能会有所帮助。 value={[value]}