如何在React中存储将在一小时内到期的日期？

Question

我有一个来自antd ui库的带日期选择器的应用程序。问题是关于使用datepicker选择数据后将其保留一个小时。请帮助我用React来实现这一点。

我希望浏览器即使关闭标签并完成会话也能保留它。而且很重要的一点是，我必须将它放在没有服务器的位置。我知道3种方式：

• 本地存储
• 会话存储
• 饼干。

可能sessionsageage是不好的。Cookie可以，并且本地存储没有到期机制。Cookie可能必须设置为不带库。我认为是这样

componentDidMount(){
   document.cookie = "rememberDates=true; expires=3600000";
}

Answer 1

React库没有专门用于帮助在浏览器中存储数据的东西，您必须为此使用浏览器API。使用Cookie可能是您最好的选择。

假设您的日期存储在Javascript Date对象中，那么这就是我要做的事情的开始：

// saves the date value as a string to a cookie called savedDate
function writeDateCookie(date) {
  document.cookie = `savedDate=${date.toString()}; max-age=3600`;
}

// loads the date object from the savedDate cookie
// returns the date as a string or null if it does not exist
// can be converted back to date with new Date(dateString)
function getDateCookie() {
  const cookieObj = Object.fromEntries(
    document.cookie.split("; ").map(c => {
      const [key, ...v] = c.split("=");
      return [key, v.join("=")];
    })
  );
  return cookieObj.savedDate ? cookieObj.savedDate : null;
}