将 Django DateField 转换为 React Calendar 的可用值

Question

我阅读了 react-calendar 的文档：https://www.npmjs.com/package/react-calendar，我阅读了 django DateField 的文档，我阅读了关于堆栈溢出的类似问题。

我的问题是试图将保存在 Django DateField 中的 YYYY MM dd 格式设置为 React 日历的可用值。我目前正在尝试使用 const value = (locale, date) => formatDate(date, 'YYYY MMM dd') 更改格式，然后在呈现日历组件时调用变量值 <Calendar value = {value}/> 但我不知道将保存的日期变量放在哪里。

我目前将日期存储为变量 {club.next}，每个页面都是动态的。

Answer 1

const djangoDate = '2021 05 13';

const newDate = new Date(djangoDate.replace(' ','-'))
console.log(newDate)

Answer 2

在你加载你的反应脚本之前把它放在一个标签里，反应将可以访问它。

var date = new Date("{{ djangoDate.isoformat }}")

Answer 3

我不知道，这是否是好的做法，但它可以节省您在需要 Django DateField 的每个组件中转换值的工作。我什至会说您正在以这种方式利用 Redux。但我不是专业人士。

在你的行动中：

export const getDates = () => dispatch => {
    axios.
        get('/api/dates/')
        .then(res => {
            for (let _date of res.data) {
                
                _date.start = new Date(_date.start);
                _date.end = new Date(_date.end);

            }
            dispatch({
                type: GET_DATES,
                payload: res.data
            });
        })
        .catch(err => console.log(err));
};

将 Django DateField 转换为 React Calendar 的可用值

Convert Django DateField to usable value for React Calendar

javascript

django

format

date

reactjs