Question

我是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的定义在下面给出

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:59:59 PM之间。\ r \ n在   System.Data.SqlTypes.SqlDateTime.FromTimeSpan（TimeSpan值）\ r \ n在   System.Data.SqlTypes.SqlDateTime.FromDateTime（DateTime值）\ r \ n在   System.Data.SqlTypes.SqlDateTime..ctor（DateTime值）\ r \ n在   System.Data.SqlClient.MetaType.FromDateTime（DateTime dateTime，Byte   cb）\ r \ n位于   System.Data.SqlClient.TdsParser.WriteUnterminatedValue（对象值，   MetaType类型，字节比例，Int32 ActualLength，Int32 encodingByteSize，   Int32偏移量，TdsParserStateObject stateObj，Int32 paramSize，布尔值   isDataFeed）\ r \ n位于   System.Data.SqlClient.TdsParser.TdsExecuteRPC（_SqlRPC [] rpcArray，   Int32超时，布尔inSchema，SqlNotificationRequest   notificationRequest，TdsParserStateObject stateObj，布尔值   isCommandProc，布尔同步，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超时，任务和任务，布尔   asyncWrite，字符串方法）\ r \ n位于   System.Data.SqlClient.SqlCommand.ExecuteReader（CommandBehavior   行为）\ r \ n   System.Data.SqlClient.SqlCommand.ExecuteDbDataReader（CommandBehavior   行为）\ r \ n，位于System.Data.Common.DbCommand.ExecuteReader（）\ r \ n
  在   Microsoft.EntityFrameworkCore.Storage.Internal.RelationalCommand.Execute（IRelationalConnection   连接，DbCommandMethod executeMethod，IReadOnlyDictionary 2 parameterValues)\r\n at Microsoft.EntityFrameworkCore.Storage.Internal.RelationalCommand.ExecuteReader(IRelationalConnection connection, IReadOnlyDictionary 2个参数Values）\ r \ n位于   Microsoft.EntityFrameworkCore.Update.ReaderModificationCommandBatch.Execute（IRelationalConnection   连接）”

有人可以帮助我了解我在哪里犯错吗？该react-datepicker中有任何错误吗？请给我解决这个问题的方法。

Answer 1

要格式化date，moment是一个不错的选择。

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

Demo

Answer 2

首先将date转换为localestrin g，如下所示

例如，日期选择器的值将类似于 2020年7月12日星期日

var date = date.toLocaleString()

输出将类似于

2020年12月7日，凌晨12.00

然后在如下所示的时刻使用格式

((dateoutputabove).replace(/,/g,''MM/DD/YYYY hh:mm:ss").format("YYYY-MM-DDThh:mm:ss")

将为您提供正确的选择器结果另请参阅Moment.js How to convert MM/dd/yyyy HH:mm:ss.fff to round-trip date/time pattern?

为什么react-datepicker无法选择正确的日期？

2 个答案: