</Portal> 文档地址:https://github.com/tajo/react-portal 5、react-calendar 这是 React 应用程序的终极日历应用程序。 react-calendar支持几乎所有语言,而且设置起来又快又容易。 有了数十种可能的模板,日历可以根据你的需要进行定制。 下面是一个react-calendar使用示例: import React, { useState } from 'react'; import Calendar from 'react-calendar onChange={onChange} value={value} />
这是react-calendar 库官方示例中的代码,我们导入使用默认样式就是这个样子 我们需要做成下面的这个样子 咋一看,确实感觉没有什么思路, 不过跟着步伐来,你会发现其实不复杂. import { useState } from 'react'; import Calendar from 'react-calendar'; type ValuePiece = Date | 日历的周字去除 formatShortWeekday 是 react-calendar 库中的一个方法,用于格式化一周中每一天的显示名称。这个方法主要用于显示日历组件中的星期几的缩写形式。
react-datepicker rc-calendar react-date-range react-day-picker react-daterange-picker react-yearly-calendar react-calendar
react-calendar image.png 基于React的应用程序的终极日历 full-calendar image.png FullCalendar 生成真实的 React 虚拟 DOM
如下图: 先看效果:https://rodchen-king.github.io/react-calendar/components/calendar 源代码:https://github.com/rodchen-king /react-calendar ?