首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >react-datepicker中的默认值

react-datepicker中的默认值
EN

Stack Overflow用户
提问于 2017-04-18 14:51:15
回答 3查看 35.2K关注 0票数 2

我在react-redux应用程序中使用react-datepicker模块,并使其与redux表单兼容,如下所示:

代码语言:javascript
复制
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>
);

问题是我不知道如何在我的模块中添加一个默认值。此默认值必须为今天。你有什么办法来处理这件事吗?

EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2017-04-18 15:01:14

更改:

代码语言:javascript
复制
 selected={props.input.value
        ? moment(props.input.value, 'DD-MM-YYYY')
        : null}

t0

代码语言:javascript
复制
 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>
);
票数 6
EN

Stack Overflow用户

发布于 2017-04-18 14:58:53

您应该使用moment(dt).format()设置日期的格式

代码语言:javascript
复制
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>
  );
}
票数 3
EN

Stack Overflow用户

发布于 2017-04-18 15:00:53

您可以在mapStateToProps阶段指定初始表单值:

代码语言:javascript
复制
const mapStateToProps = state => {
  return {
    initialValues: {
      date: moment()
    } // Use the `initialValues` property to set your initial data
  };
}

这里也解释了这一点:http://redux-form.com/6.6.3/examples/initializeFromState/

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/43465468

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档