如何存储日期选择器中的日期?
How can I store the date from datepicker?
import React from 'react';
import { useState } from 'react';
import DatePicker from 'react-datepicker';
import 'react-datepicker/dist/react-datepicker.css';
import './Card.css';
const Card = (props) => {
const [selectedDate, setSelectedDate] = useState()
return (
<div className='tc bg-light-green dib br3 pa3 ma2 bw2 shadow-5'>
<img alt ='grass' src={props.img}/>
<div>
<h1>Tuns la data de:</h1>
<DatePicker
selected={selectedDate}
onChange={date => setSelectedDate(date)}
dateFormat='dd/MM/yyyy'
maxDate = {new Date()}
/>
<h1>Data tundere:</h1>
<h2>{props.name}</h2>
<p>{props.speed}</p>
</div>
</div>
)
}
export default Card;
您好!这是我的 Card 组件,我希望每次 运行 npm start 时,我的 date picker value 显示我选择的最后一个日期。
我正在考虑使用一个 var 来存储该值,但我不知道该将该变量放在哪里。
请帮助我。
您的 React 应用程序及其组件将不会在 npm start
的运行之间持续存在。如果要持久保存此值,则需要将其保存到浏览器的本地存储、本地文件或持久保存的数据库中。
这是在本地存储中持久化的快速教程:https://dev.to/selbekk/persisting-your-react-state-in-9-lines-of-code-9go
import React from 'react';
import { useState } from 'react';
import DatePicker from 'react-datepicker';
import 'react-datepicker/dist/react-datepicker.css';
import './Card.css';
const Card = (props) => {
const [selectedDate, setSelectedDate] = useState()
return (
<div className='tc bg-light-green dib br3 pa3 ma2 bw2 shadow-5'>
<img alt ='grass' src={props.img}/>
<div>
<h1>Tuns la data de:</h1>
<DatePicker
selected={selectedDate}
onChange={date => setSelectedDate(date)}
dateFormat='dd/MM/yyyy'
maxDate = {new Date()}
/>
<h1>Data tundere:</h1>
<h2>{props.name}</h2>
<p>{props.speed}</p>
</div>
</div>
)
}
export default Card;
您好!这是我的 Card 组件,我希望每次 运行 npm start 时,我的 date picker value 显示我选择的最后一个日期。 我正在考虑使用一个 var 来存储该值,但我不知道该将该变量放在哪里。 请帮助我。
您的 React 应用程序及其组件将不会在 npm start
的运行之间持续存在。如果要持久保存此值,则需要将其保存到浏览器的本地存储、本地文件或持久保存的数据库中。
这是在本地存储中持久化的快速教程:https://dev.to/selbekk/persisting-your-react-state-in-9-lines-of-code-9go