如何解决ReactJS-显示当前日期前一年的日期
我正在为我的Web应用程序提供带有过滤器的搜索功能。我有查询的开始日期和结束日期,但是默认情况下,我希望结束日期始终显示今天的日期,但是开始日期要显示比“今天的日期”晚1年的日期。
代码:
import React from "react";
import { Redirect,Route,Switch } from "react-router-dom";
import { Paper } from "@material-ui/core";
class MainSection extends React.Component {
static contextType = AppContext;
constructor(props) {
super(props);
this.state = {
searchTerm: "",startDate: new Date(),endDate: new Date(),update: (data) => {
console.debug(data)
this.setState(data);
},};
}
我目前将startDate留空以免引起混淆。
预期输出为:
今天:
开始日期:2019/10/08
结束日期:2020/10/08
明天:
开始日期:2019/10/09
结束日期:2020/10/09
等等...
值得一提的是,我是编程新手,所以如果我缺少明显的东西,请放轻松!
欢迎提出问题建议,这样我就可以学习Stack Overflow礼节。
解决方法
var date = new Date();
date.setFullYear(date.getFullYear() - 1);
console.log(date)
要在您的代码中使用它:
class MainSection extends React.Component {
static contextType = AppContext;
constructor(props) {
super(props);
const oneYearAgo = new Date();
oneYearAgo.setFullYear(oneYearAgo.getFullYear() - 1);
this.state = {
searchTerm: "",startDate: oneYearAgo,endDate: new Date(),update: (data) => {
console.debug(data)
this.setState(data);
},};
}
,
您可以使用moment.js库来满足所有日期操作要求。它具有减法功能,您可以使用该功能将日期追溯到1年。 对于React,有个react-moment npm会很方便。
下面是链接。 https://www.npmjs.com/package/react-moment
https://www.npmjs.com/package/react-moment#add-and-subtract
,看看这段代码
var date = new Date();
document.querySelectorAll('#originalDate')[0].innerText = date.toISOString()
date.setFullYear(date.getFullYear() - 1);
document.querySelectorAll('#editedDate')[0].innerText = date.toISOString()
<p id="originalDate"> </p>
<p id="editedDate"> </p>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。