!21711 DatePicker相关回调接口调整 Doc

Merge pull request !21711 from tengfan/DatePicker0801

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-datepicker.md

@@ -68,9 +68,10 @@ DatePicker(options?: {start?: Date, end?: Date, selected?: Date})
 
 除支持[通用事件](ts-universal-events-click.md)外，还支持以下事件：
 
-| 名称                                       | 功能描述        |
-| ---------------------------------------- | ----------- |
-| onChange(callback: (value: DatePickerResult) => void) | 选择日期时触发该事件。 |
+| 名称                                                         | 功能描述                                                     |
+| ------------------------------------------------------------ | ------------------------------------------------------------ |
+| onChange(callback:&nbsp;(value:&nbsp;DatePickerResult)&nbsp;=&gt;&nbsp;void)<sup>(deprecated)</sup> | 选择日期时触发该事件。<br />**说明：**<br />从API version 8 开始支持，从 API version 10 开始废弃，建议使用onDateChange(callback: (value: Date) => void)。 |
+| onDateChange(callback: (value: Date) => void)<sup>10+</sup>  | 选择日期时触发该事件。                                       |
 
 ## DatePickerResult对象说明
 
@@ -108,9 +109,9 @@ struct DatePickerExample {
         .textStyle({color: '#ff182431', font: {size: '18fp', weight: FontWeight.Normal}})
         .selectedTextStyle({color: '#ff0000FF', font: {size: '26fp', weight: FontWeight.Regular}})
         .lunar(this.isLunar)
-        .onChange((value: DatePickerResult) => {
-          this.selectedDate.setFullYear(value.year, value.month, value.day)
-          console.info('select current date is: ' + JSON.stringify(value))
+        .onDateChange((value: Date) => {
+          this.selectedDate = value
+          console.info('select current date is: ' + value.toString())
         })
 
     }.width('100%')

zh-cn/application-dev/reference/arkui-ts/ts-methods-datepicker-dialog.md

@@ -29,9 +29,11 @@ show(options?: DatePickerDialogOptions)
 | disappearTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 否 | 设置所有选项中最上和最下两个选项的文本颜色、字号、字体粗细。<br/>默认值：<br/>{<br/>color: '#ff182431',<br/>font: {<br/>size: '14fp', <br/>weight: FontWeight.Regular<br/>}<br/>} |
 | textStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 否 | 设置所有选项中除了最上、最下及选中项以外的文本颜色、字号、字体粗细。<br/>默认值：<br/>{<br/>color: '#ff182431',<br/>font: {<br/>size: '16fp', <br/>weight: FontWeight.Regular<br/>}<br/>} |
 | selectedTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 否 | 设置选中项的文本颜色、字号、字体粗细。<br/>默认值：<br/>{<br/>color: '#ff007dff',<br/>font: {<br/>size: '20vp', <br/>weight: FontWeight.Medium<br/>}<br/>} |
-| onAccept | (value: [DatePickerResult](ts-basic-components-datepicker.md#DatePickerResult对象说明)) => void | 否 | 点击弹窗中的“确定”按钮时触发该回调。 |
+| onAccept<sup>(deprecated)</sup> | (value: [DatePickerResult](ts-basic-components-datepicker.md#DatePickerResult对象说明)) => void | 否 | 点击弹窗中的“确定”按钮时触发该回调。<br />**说明：**<br />从API version 8 开始支持，从 API version 10 开始废弃，建议使用onDateAccept。 |
 | onCancel | () => void | 否 | 点击弹窗中的“取消”按钮时触发该回调。 |
-| onChange | (value: [DatePickerResult](ts-basic-components-datepicker.md#DatePickerResult对象说明)) => void | 否 | 滑动弹窗中的滑动选择器使当前选中项改变时触发该回调。 |
+| onChange<sup>(deprecated)</sup> | (value: [DatePickerResult](ts-basic-components-datepicker.md#DatePickerResult对象说明)) => void | 否 | 滑动弹窗中的滑动选择器使当前选中项改变时触发该回调。<br />**说明：**<br />从API version 8 开始支持，从 API version 10 开始废弃，建议使用onDateChange。 |
+| onDateAccept<sup>10+</sup> | (value:  Date) => void | 否 | 点击弹窗中的“确定”按钮时触发该回调。<br />**说明：**<br />当showTime设置为true时，回调接口返回值value中时和分为选择器选择的时和分。否则，返回值value中时和分为系统时间的时和分。 |
+| onDateChange<sup>10+</sup> | (value:  Date) => void | 否 | 滑动弹窗中的滑动选择器使当前选中项改变时触发该回调。<br />**说明：**<br />当showTime设置为true时，回调接口返回值value中时和分为选择器选择的时和分。否则，返回值value中时和分为系统时间的时和分。 |
 
 **异常情形说明:**
 
@@ -76,16 +78,16 @@ struct DatePickerDialogExample {
             disappearTextStyle: {color: Color.Pink, font: {size: '22fp', weight: FontWeight.Bold}},
             textStyle: {color: '#ff00ff00', font: {size: '18fp', weight: FontWeight.Normal}},
             selectedTextStyle: {color: '#ff182431', font: {size: '14fp', weight: FontWeight.Regular}},
-            onAccept: (value: DatePickerResult) => {
+            onDateAccept: (value: Date) => {
               // 通过Date的setFullYear方法设置按下确定按钮时的日期，这样当弹窗再次弹出时显示选中的是上一次确定的日期
-              this.selectedDate.setFullYear(value.year, value.month, value.day)
-              console.info("DatePickerDialog:onAccept()" + JSON.stringify(value))
+              this.selectedDate = value
+              console.info("DatePickerDialog:onDateAccept()" + value.toString())
             },
             onCancel: () => {
               console.info("DatePickerDialog:onCancel()")
             },
-            onChange: (value: DatePickerResult) => {
-              console.info("DatePickerDialog:onChange()" + JSON.stringify(value))
+            onDateChange: (value: Date) => {
+              console.info("DatePickerDialog:onDateChange()" + value.toString())
             }
           })
         })
@@ -101,15 +103,15 @@ struct DatePickerDialogExample {
             disappearTextStyle: {color: Color.Pink, font: {size: '22fp', weight: FontWeight.Bold}},
             textStyle: {color: '#ff00ff00', font: {size: '18fp', weight: FontWeight.Normal}},
             selectedTextStyle: {color: '#ff182431', font: {size: '14fp', weight: FontWeight.Regular}},
-            onAccept: (value: DatePickerResult) => {
-              this.selectedDate.setFullYear(value.year, value.month, value.day)
-              console.info("DatePickerDialog:onAccept()" + JSON.stringify(value))
+            onDateAccept: (value: Date) => {
+              this.selectedDate = value
+              console.info("DatePickerDialog:onDateAccept()" + value.toString())
             },
             onCancel: () => {
               console.info("DatePickerDialog:onCancel()")
             },
-            onChange: (value: DatePickerResult) => {
-              console.info("DatePickerDialog:onChange()" + JSON.stringify(value))
+            onDateChange: (value: Date) => {
+              console.info("DatePickerDialog:onDateChange()" + value.toString())
             }
           })
         })