reactjs - 在 React js 中显示范围日历日期的问题

问题描述

嗨，我正在为我的要求创建 RangeDate 日历。日历运行良好。但是当我提交日期时，它会显示一些数字，例如 1,234,245,45,679。例如我选择 01-10-2019 到 12-10-2019 看到这个

当我提交日期时，它会像这样显示提交后

为什么它显示数字。如何显示日期类型，如 01-10-2019 到 12-10-2019。请帮助我。我屏蔽了2天。

我的代码是

    class RangeCalender extends Component {
    constructor(props) {
    super(props);
    const date = new Date()
    const startDate = date.getTime()
    this.state = {
      startDate, // Today
      endDate: new Date(startDate).setDate(date.getDate() + 6) // Today + 6 days
       };
     }
   onChange = (startDate, endDate) => this.setState({ startDate, endDate })

   sendData = (newMessage) => {
     addUserMessage(this.state.startDate.toLocaleString())
     console.log(this.state.startDate.toLocaleString());
   }
   render = () => {
    const {trigger, startDate, endDate } = this.state
    return (
        <div>
          <ReactLightCalendar startDate={startDate} endDate={endDate} onChange={this.onChange} range 
            displayTime />
          <button class = "Rcbutton"  onClick={() => this.sendData()}>Submit </button>
        </div>
    )
  }
}

实际上我是 React js 的新手。请帮我

提前致谢

标签： reactjsreact-nativereact-router

它显示数字，因为日期存储为UNIX 时间戳。要将其显示为日期，您需要将其转换为日期格式。

UNIX 时间戳被如此广泛使用的原因是因为它们可以同时代表所有时区。

有很多方法可以进行这种转换。就我个人而言，我在ReactJS中的大部分日期处理都使用 moment.js。

使用 momentjs，您可以执行以下操作：

var dateAsString = moment.unix(value).format("MM-DD-YYYY");

希望这可以帮助您解决此问题。

reactjs - 在 React js 中显示范围日历日期的问题

问题描述

解决方案

推荐阅读