【问题标题】:How can I store the date from datepicker?如何存储日期选择器中的日期?
【发布时间】:2020-12-07 20:00:00
【问题描述】:
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 来存储该值,但我不知道该变量放在哪里。 请帮帮我。

【问题讨论】:

  • 从您的卡片组件中的父组件传递默认日期值。

标签: reactjs date datepicker


【解决方案1】:

您的 React 应用程序及其组件不会在 npm start 的运行之间持续存在。如果要持久化此值,则需要将其保存到浏览器的本地存储、本地文件或持久化的数据库中。

这里有一个在本地存储中持久化的快速教程:https://dev.to/selbekk/persisting-your-react-state-in-9-lines-of-code-9go

【讨论】:

    猜你喜欢
    • 2016-06-02
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多