reactjs - React-nice-calendar 缺少一年
问题描述
我在我的应用程序中使用react-nice-calender。问题是您在图像中看到的日历中缺少年份。我该如何解决这个问题!
编码 :
const [date, setDate] = useState();
<DatePickerCalendar
date={date}
onDateChange={setDate}
locale={enGB}
/>
解决方案
如果你想显示年份,你必须使用 date-fns 依赖来格式化日期,所以我举个例子: https ://reactnicedates.hernansartorio.com/
import React, { useState } from 'react'
import { format } from 'date-fns'
import { enGB } from 'date-fns/locale'
import { DatePickerCalendar } from 'react-nice-dates'
import 'react-nice-dates/build/style.css'
function DatePickerCalendarExample() {
const [date, setDate] = useState()
return (
<div>
<p>
Selected date: {date ? format(date, 'dd MMM yyyy', { locale: enGB }) : 'none'}.
</p>
<DatePickerCalendar date={date} onDateChange={setDate} locale={enGB} />
</div>
)
}
这里有一个代码框: https ://codesandbox.io/s/datepicker-default-example-0kn7i
如果您在当前年份,则不会出现:
推荐阅读
- swift - 从 AF responseJSON 获取数据
- python - 是否可以设置模型字段以从多个表中减去值的总和
- javascript - 我需要 swfobject.js 的替代解决方案
- java - JUnit Category - 如何避免代码重复
- google-bigquery - 从 BigQuery 表中删除最旧的重复行
- json - 在 Swift 5 中使用 Codable 解码 JSON 数组
- angular - 如何设置材料步进器默认打开第二项并设置图标颜色?(Angular Material)
- oracle - 如何将检查约束从 SQL Server 转换为 Oracle
- excel - 如何在 Excel VBA 中将时间转换为美国时区?
- android - Android Play Publisher 插件 Jenkins 中的空指针异常