reactjs 为什么react-datepicker没有选择正确的日期?

wlwcrazw  于 2023-10-17  发布在  React
关注(0)|答案(2)|浏览(127)

我是React的新手,我使用过this datepicker,并使用了以下代码

class Example extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      startDate: new Date()
    };
    this.handleChange = this.handleChange.bind(this);
  }

  handleChange(date) {
    this.setState({
      startDate: date
    });
  }

  render() {
    return (
      <DatePicker
        selected={this.state.startDate}
        onChange={this.handleChange}
      />
    );
  }
}

手柄变化的定义如下

handleChange(date) {
        this.setState({
            startDate: date
        });
    }

在此之后,我已经转换的格式,我需要在我的程序中的日期

var dateformat = (new Intl.DateTimeFormat('en-US',
            { year: 'numeric', month: '2-digit', day: '2-digit', 
hour: '2-digit', minute: '2-digit', second: '2-digit' }).format(this.state.startDate));

有时它会选择正确的日期。但大多数情况下,它会返回这个01 - 01 - 0001 12:00:00 AM日期和时间,这是默认值。
由于该日期,我通常得到的例外情况如下:
"System. Data. SqlTypes. SqlTypeException:SqlDateTime溢出。必须在1/1/1753 12之间:00:00 AM和12/31/9999 11:五十九:下午五十九点。\r\n在系统上。数据。SqlTypes。SqlDateTime。FromTimeSpan(TimeSpan值)\r\n位于系统。数据。SqlTypes。SqlDateTime。FromDateTime(DateTime值)\r\n位于System.Data.SqlTypes.SqlDateTime.. ctor(DateTime值)\r\n位于系统。数据。SqlClient。MetaType。FromDateTime(DateTime dateTime,Byte cb)\r\n在系统上。数据。SqlClient。TdsParser。WriteUnterminatedValue(Object value,MetaType type,Byte scale,Int32 actualLength,Int32 encodingByteSize,Int32 offset,TdsParserStateObject stateObj,Int32 paramSize,Boolean isDataFeed)\r\n位于系统。数据。SqlClient。TdsParser。TdsExecuteRPC(_SqlRPC [] rpcArray,Int32 timeout,Boolean inSchema,SqlNotificationRequest notificationRequest,TdsParserStateObject stateObj,Boolean isCommandProc,Boolean sync,TaskCompletionSource 1 completion, Int32 startRpc, Int32 startParam)\r\n at System.Data.SqlClient.SqlCommand.RunExecuteReaderTds(CommandBehavior cmdBehavior, RunBehavior runBehavior, Boolean returnStream, Boolean async, Int32 timeout, Task& task, Boolean asyncWrite, SqlDataReader ds)\r\n at System.Data.SqlClient.SqlCommand.RunExecuteReader(CommandBehavior cmdBehavior, RunBehavior runBehavior, Boolean returnStream, TaskCompletionSource 1完成,Int32超时,任务和任务,布尔值,字符串方法)\r\n在系统上。数据。SqlClient。SqlCommand。ExecuteReader(CommandBehavior行为)\r\n在系统上。数据。SqlClient。SqlCommand。ExecuteDbDataReader(CommandBehavior行为)\r\n在系统上。数据。很普通DbCommand。ExecuteReader()\r\n
在Microsoft. ReadtyFrameworkCore. Storage. Internal. ReadalCommand. Execute(IReadalConnection连接,DbCommandMethod executeMethod,IReadOnlyDictionary 2 parameterValues)\r\n at Microsoft.EntityFrameworkCore.Storage.Internal.RelationalCommand.ExecuteReader(IRelationalConnection connection, IReadOnlyDictionary 2 parameterValues)\r\n在Microsoft. ReadyFrameworkCore. Update. ReaderModificationCommandBatch. Execute(IReadalConnection连接)"
有谁能帮我理解我在哪里犯了错误?在那个react-datepicker里有bug吗?请给予我这个问题的解决办法。

ds97pgxw

ds97pgxw1#

要格式化datemoment是一个不错的选择。

moment(this.state.startDate).format('DD/MM/YYYY')

Demo

lf5gs5x2

lf5gs5x22#

首先将date转换为localestring,如下所示:
例如,日期选择器值将类似于2020年7月12日星期日

var date = date.toLocaleString()

输出将类似于:
2020年12月7日上午12点
然后使用格式化的时刻如下所示:
((dateoutputabove).replace(/,/g,''MM/DD/YYYY hh:mm:ss”).format(“YYYY-MM-DDThh:mm:ss”)
会在picker中给你给予正确的结果。另请参阅Moment.js如何将MM/dd/yyyy HH:mm:ss.fff转换为往返日期/时间模式?

相关问题