diff --git a/src/packages/calendarcard/calendarcard.taro.tsx b/src/packages/calendarcard/calendarcard.taro.tsx index f17c314f38..e6d75abdf7 100644 --- a/src/packages/calendarcard/calendarcard.taro.tsx +++ b/src/packages/calendarcard/calendarcard.taro.tsx @@ -1,4 +1,4 @@ -import React, { useCallback, useEffect, useState, useRef, useMemo } from 'react' +import React, { useCallback, useEffect, useState, useRef } from 'react' import classNames from 'classnames' import { View } from '@tarojs/components' import { ArrowLeft, ArrowRight, DoubleLeft, DoubleRight } from './icon.taro' @@ -24,7 +24,6 @@ const defaultProps = { ...ComponentDefaults, type: 'single', firstDayOfWeek: 0, - weekdays: [], } const prefixCls = 'nut-calendarcard' @@ -48,7 +47,6 @@ export const CalendarCard = React.forwardRef< renderDay, renderDayTop, renderDayBottom, - weekdays, onDayClick, onPageChange, onChange, @@ -237,36 +235,6 @@ export const CalendarCard = React.forwardRef< return d === 0 || d === 6 } - const isToday = (day: CalendarCardDay) => { - const today = new Date() - return ( - day.year === today.getFullYear() && - day.month === today.getMonth() + 1 && - day.date === today.getDate() - ) - } - - // 日期无障碍朗读 - const getAriaLabel = (day: CalendarCardDay) => { - const today = isToday(day) - // 日期选定时,朗读="已选定 1号 按钮" - if (isActive(day)) { - return today - ? `已选定今日${day.month}月${day.date}号` - : `已选定${day.month}月${day.date}号` - } - // 若不可选中,朗读=“3号 按钮 变暗” - if (isDisable(day)) { - return today - ? `${day.month}月${day.date}号今日按钮变暗` - : `${day.month}月${day.date}号按钮变暗` - } - // 未选定时,朗读=“2号 按钮” - return today - ? `${day.month}月${day.date}号今日` - : `${day.month}月${day.date}号` - } - const getClasses = (day: CalendarCardDay) => { /** * active: single、multiple 激活日期 @@ -429,20 +397,18 @@ export const CalendarCard = React.forwardRef< ) } - const weekHeader = useMemo(() => { - const weekdaysList = - weekdays.length > 0 ? weekdays : locale.calendaritem.weekdays - const weekdaysData = weekdaysList.map((day, index) => { + const [weekHeader] = useState(() => { + const weekdays = locale.calendaritem.weekdays.map((day, index) => { return { name: day, key: index, } }) return [ - ...weekdaysData.slice(firstDayOfWeek, 7), - ...weekdaysData.slice(0, firstDayOfWeek), + ...weekdays.slice(firstDayOfWeek, 7), + ...weekdays.slice(0, firstDayOfWeek), ] - }, [weekdays, firstDayOfWeek, locale.calendaritem.weekdays]) + }) const renderContent = () => { return ( @@ -471,14 +437,11 @@ export const CalendarCard = React.forwardRef< )} key={`${day.year}-${day.month}-${day.date}`} onClick={() => handleDayClick(day)} - ariaLabel={getAriaLabel(day)} - ariaRole="button" > {renderDayTop ? renderDayTop(day) : ''} - {/* @ts-ignore */} - + {renderDay ? renderDay(day) : day.date} diff --git a/src/packages/calendarcard/demo.taro.tsx b/src/packages/calendarcard/demo.taro.tsx index ace887f98a..d66f433074 100644 --- a/src/packages/calendarcard/demo.taro.tsx +++ b/src/packages/calendarcard/demo.taro.tsx @@ -16,7 +16,6 @@ import Demo9 from './demos/taro/demo9' import Demo10 from './demos/taro/demo10' import Demo11 from './demos/taro/demo11' import Demo12 from './demos/taro/demo12' -import Demo13 from './demos/taro/demo13' const CalendarDemo = () => { const [translated] = useTranslate({ @@ -35,7 +34,6 @@ const CalendarDemo = () => { confirm: '确定', ref: '使用 Ref 上的方法', title: '搭配 Ref 使用自定义头', - customWeekdays: '自定义周几', }, 'zh-TW': { single: '選擇單個日期', @@ -52,7 +50,6 @@ const CalendarDemo = () => { confirm: '確定', ref: '使用 Ref 上的方法', title: '搭配 Ref 使用自定義头', - customWeekdays: '自定義周几', }, 'en-US': { single: 'Select a single date', @@ -69,7 +66,6 @@ const CalendarDemo = () => { confirm: 'Confirm', ref: 'Use ref', title: 'Custom title', - customWeekdays: 'Custom weekdays', }, }) @@ -101,8 +97,6 @@ const CalendarDemo = () => { {translated.title} - {translated.customWeekdays} - ) diff --git a/src/packages/calendarcard/demos/taro/demo13.tsx b/src/packages/calendarcard/demos/taro/demo13.tsx deleted file mode 100644 index 2a9d0bb009..0000000000 --- a/src/packages/calendarcard/demos/taro/demo13.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import React, { useRef, useState } from 'react' -import { CalendarCard, CalendarCardRef } from '@nutui/nutui-react-taro' - -const date = new Date('2025-01-01') - -const Demo13 = () => { - const [dateStr, setDate] = useState(date.getMonth()) - const onPageChange = (val: any) => { - console.log('onPageChange', val) - setDate(val.month) - } - const CalendarCardRef = useRef(null) - - return ( - - ) -} -export default Demo13 diff --git a/src/types/spec/calendarcard/base.ts b/src/types/spec/calendarcard/base.ts index 525fa15778..a3f2e2a823 100644 --- a/src/types/spec/calendarcard/base.ts +++ b/src/types/spec/calendarcard/base.ts @@ -30,7 +30,6 @@ export interface BaseCalendarCard extends BaseProps { firstDayOfWeek: number // 0-6 startDate: Date endDate: Date - weekdays?: string[] disableDay: (day: CalendarCardDay) => boolean renderDay: (day: CalendarCardDay) => ReactNode renderDayTop: (day: CalendarCardDay) => ReactNode