javascript - React datepicker解析所选日期

标签 javascript reactjs react-datepicker

我有以下组件:

import React, {Component, Fragment} from 'react';
import DatePicker from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";
// import PropTypes from 'prop-types';

class Form extends Component {
    state = { 
        selected: new Date()
    }

    handleChange = date => {
        console.log('date: ', date)
        this.setState({
            selected: date
        });
    }

    render() { 
        const {selected} = this.state;
        return (
            <Fragment>
                <form>
                    <DatePicker
                        dateFormat="dd/MM/yyyy" 
                        onChange={this.handleChange} 
                        selected={selected}
                    />
                    <button>search</button>
                </form>
            </Fragment>
        );
    }
}

export default Form;

当我从日期选择器中选择任何日期时,我会得到以下格式:

日期:2019 年 5 月 15 日星期三 12:54:33 GMT+0100(英国夏令时间)

可以将其解析回如下格式:

2019-05-15/yyyy-mm-dd

因为我需要它以该格式提交以进行 API 调用?

最佳答案

是的,最简单的方法是使用已建立的库,例如 momentjs .

然后您可以将日期解析为您喜欢的任何格式:

date = moment(date).format("YYYY-MM-DD")

关于javascript - React datepicker解析所选日期,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56004884/

相关文章:

reactjs - 仅获取日期并仅提供日期作为react-date-picker的输入

javascript - 访问串联变量名的值

javascript - Fabric.js Draw_grid 无法读取未定义的属性 'moveTo'

javascript - 使用 Javascript - 如何单击没有 ID、值或名称的提交按钮

javascript - 如何在 create-react-app 项目中重命名 index.html?

javascript - 在 react-native 中迭代 JSON 数组

javascript - 在reactjs中控制导航栏中的redux属性

javascript - 数据绑定(bind)的主要例子

reactjs - 使用 React Datepicker 从给定日期排除 future 日期

javascript - react-dates 与 moment js 的日期差异