react-datepicker 中的默认值

新手上路,请多包涵

我在我的 react-redux 应用程序中使用 react-datepicker 模块,我使它与 redux 形式兼容,如下所示:

 const MyDatePicker = props => (
  <div>
    <DatePicker
      {...props.input}
      dateFormat="DD-MM-YYYY"
      selected={props.input.value
        ? moment(props.input.value, 'DD-MM-YYYY')
        : null}
      placeholderText={props.placeholder}
      disabled={props.disabled}
    />
    {
      props.meta.touched && props.meta.error &&
      <span className="error">
        { props.intl.formatMessage({ id: props.meta.error }) }
      </span>
    }
  </div>
);

问题是我不知道如何在我的模块中添加默认值。此默认值必须是今天。关于如何处理这个问题的任何想法?

原文由 user7334203 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 1.6k
2 个回答

改变:

  selected={props.input.value
        ? moment(props.input.value, 'DD-MM-YYYY')
        : null}

t0

  selected={props.input.value ? moment(props.input.value, 'DD-MM-YYYY') : moment()}

const MyDatePicker = props => (
  <div>
    <DatePicker
      {...props.input}
      dateFormat="DD-MM-YYYY"
  selected={props.input.value ? moment(props.input.value, 'DD-MM-YYYY') : moment()}
      placeholderText={props.placeholder}
      disabled={props.disabled}
    />
    {
      props.meta.touched && props.meta.error &&
      <span className="error">
        { props.intl.formatMessage({ id: props.meta.error }) }
      </span>
    }
  </div>
);

原文由 Ved 发布,翻译遵循 CC BY-SA 3.0 许可协议

您应该使用 moment(dt).format() 来格式化日期

const MyDatePicker = props => {
  var date = new Date();
  var todayDate = moment(date).format('DD-MM-YYYY');
  return (
  <div>
    <DatePicker
      {...props.input}
      dateFormat="DD-MM-YYYY"
      selected={props.input.value
        ? moment(props.input.value).format('DD-MM-YYYY')
        : todayDate}
      placeholderText={props.placeholder}
      disabled={props.disabled}
    />
    {
      props.meta.touched && props.meta.error &&
      <span className="error">
        { props.intl.formatMessage({ id: props.meta.error }) }
      </span>
    }
  </div>
  );
}

原文由 Shubham Khatri 发布,翻译遵循 CC BY-SA 3.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进