import React, { useState } from 'react';
import Header from '../header/header';
import Day from '../day/day'
import {BrowserRouter as Router} from 'react-router-dom';
import './app.css';
export default function App() {
const [currentDay, setDay] = useState(new Date());
console.log(currentDay)
function nextDay() {
console.log("next clicked");
let nextDate = new Date(currentDay.getTime());
nextDate = nextDate.setDate(nextDate.getDate() + 1);
setDay(nextDate);
}
return (
<>
<Router>
<Header/>
</Router>
<Day
date={currentDay}
nextDay={nextDay}/>
</>
)
}
import React from 'react';
import Moment from 'react-moment';
import './day.css';
export default function Day({date, nextDay}) {
return (
<div className="day-container">
<Moment>{date}</Moment>
<span onClick={() => nextDay()}>next</span>
</div>
)
}
单击下一步后,日期对象变为时间戳,第二次单击后抛出错误(currentDay.getTime 不是函数)我不明白其原因。
Date.prototype.setDate更新日期并返回日期的纪元值。
您不需要返回值,只需执行以下操作:
let nextDate = new Date(currentDay.getTime());
nextDate.setDate(nextDate.getDate() + 1);
setDay(nextDate);
您的原始变量仍然可以使用。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句