feat: datepickerview

src/config.json

@@ -223,17 +223,17 @@
           "dd": true
         },
         {
-            "version": "3.0.0",
-            "name": "Col",
-            "type": "component",
-            "cName": "列",
-            "desc": "布局组件中的列",
-            "sort": 3,
-            "show": false,
-            "exportEmpty": true,
-            "author": "yushuang24",
-            "dd": true
-          },
+          "version": "3.0.0",
+          "name": "Col",
+          "type": "component",
+          "cName": "列",
+          "desc": "布局组件中的列",
+          "sort": 3,
+          "show": false,
+          "exportEmpty": true,
+          "author": "yushuang24",
+          "dd": true
+        },
         {
           "version": "3.0.0",
           "name": "Row",
@@ -584,6 +584,19 @@
           "author": "dsj",
           "dd": false
         },
+        {
+          "version": "3.0.0",
+          "name": "DatePickerView",
+          "type": "component",
+          "cName": "日期选择器视图",
+          "desc": "DatePickerView 是 DatePicker 的内容区域",
+          "sort": 16,
+          "show": true,
+          "taro": true,
+          "v15": false,
+          "dd": false,
+          "author": "songsong"
+        },
         {
           "version": "2.0.0",
           "name": "Form",

src/packages/datepicker/datepicker.taro.tsx

@@ -4,6 +4,8 @@ import React, {
   ForwardRefRenderFunction,
   useImperativeHandle,
 } from 'react'
+import isEqual from 'react-fast-compare'
+import classNames from 'classnames'
 import { View } from '@tarojs/components'
 import Picker from '@/packages/picker/index.taro'
 import { useConfig } from '@/packages/configprovider/index.taro'
@@ -77,6 +79,9 @@ const InternalPicker: ForwardRefRenderFunction<
     seconds: lang.seconds,
   }
 
+  const classPrefix = 'nut-datepicker'
+  const cls = classNames(classPrefix, className)
+
   const [pickerValue, setPickerValue] = useState<PickerValue[]>([])
   const [pickerOptions, setPickerOptions] = useState<PickerOptions[]>([])
 
@@ -111,9 +116,8 @@ const InternalPicker: ForwardRefRenderFunction<
     selectedOptions: PickerOptions,
     index: number
   ) => {
-    const isEqual = new Date(innerDate)?.getTime() === newDate?.getTime()
     if (newDate && isDate(newDate)) {
-      if (!isEqual) {
+      if (!isEqual(new Date(selectedDate)?.getTime(), newDate?.getTime())) {
         setInnerDate(formatValue(newDate, startDate, endDate))
       }
       onChange?.(
@@ -130,8 +134,7 @@ const InternalPicker: ForwardRefRenderFunction<
 
   const handleConfirmDateComparison = (newDate: Date | null) => {
     if (newDate && isDate(newDate)) {
-      const isEqual = new Date(selectedDate)?.getTime() === newDate?.getTime()
-      if (!isEqual) {
+      if (!isEqual(new Date(selectedDate)?.getTime(), newDate?.getTime())) {
         setSelectedDate(formatValue(newDate, startDate, endDate))
       }
     }
@@ -223,7 +226,7 @@ const InternalPicker: ForwardRefRenderFunction<
   return (
     <>
       {typeof children === 'function' && children(selectedDate)}
-      <View className={`nut-datepicker ${className}`} style={style} {...rest}>
+      <View className={cls} style={style} {...rest}>
         {pickerOptions.length && (
           <Picker
             {...pickerProps}

src/packages/datepicker/datepicker.tsx

@@ -4,6 +4,8 @@ import React, {
   ForwardRefRenderFunction,
   useImperativeHandle,
 } from 'react'
+import isEqual from 'react-fast-compare'
+import classNames from 'classnames'
 import Picker from '@/packages/picker'
 import { useConfig } from '@/packages/configprovider'
 import { usePropsValue } from '@/hooks/use-props-value'
@@ -75,6 +77,9 @@ const InternalPicker: ForwardRefRenderFunction<
     seconds: lang.seconds,
   }
 
+  const classPrefix = 'nut-datepicker'
+  const cls = classNames(classPrefix, className)
+
   const [pickerValue, setPickerValue] = useState<PickerValue[]>([])
   const [pickerOptions, setPickerOptions] = useState<PickerOptions[]>([])
 
@@ -109,9 +114,8 @@ const InternalPicker: ForwardRefRenderFunction<
     selectedOptions: PickerOptions,
     index: number
   ) => {
-    const isEqual = new Date(innerDate)?.getTime() === newDate?.getTime()
     if (newDate && isDate(newDate)) {
-      if (!isEqual) {
+      if (!isEqual(new Date(selectedDate)?.getTime(), newDate?.getTime())) {
         setInnerDate(formatValue(newDate, startDate, endDate))
       }
       onChange?.(
@@ -128,8 +132,7 @@ const InternalPicker: ForwardRefRenderFunction<
 
   const handleConfirmDateComparison = (newDate: Date | null) => {
     if (newDate && isDate(newDate)) {
-      const isEqual = new Date(selectedDate)?.getTime() === newDate?.getTime()
-      if (!isEqual) {
+      if (!isEqual(new Date(selectedDate)?.getTime(), newDate?.getTime())) {
         setSelectedDate(formatValue(newDate, startDate, endDate))
       }
     }
@@ -221,7 +224,7 @@ const InternalPicker: ForwardRefRenderFunction<
   return (
     <>
       {typeof children === 'function' && children(selectedDate)}
-      <div className={`nut-datepicker ${className}`} style={style} {...rest}>
+      <div className={cls} style={style} {...rest}>
         {pickerOptions.length && (
           <Picker
             {...pickerProps}