diff --git a/compiled/alipay/demo/pages/Calendar/index.axml b/compiled/alipay/demo/pages/Calendar/index.axml
index f00231032..14c3806f7 100644
--- a/compiled/alipay/demo/pages/Calendar/index.axml
+++ b/compiled/alipay/demo/pages/Calendar/index.axml
@@ -103,12 +103,15 @@
-
+
+ selectionMode="single"
+ changedScrollIntoView />
@@ -120,5 +123,11 @@
onTap="demo9HandleNextDay">
下一天
+
+ 回到初始化日期
+
diff --git a/compiled/alipay/demo/pages/Calendar/index.js b/compiled/alipay/demo/pages/Calendar/index.js
index 634c41ba1..80e2fee34 100644
--- a/compiled/alipay/demo/pages/Calendar/index.js
+++ b/compiled/alipay/demo/pages/Calendar/index.js
@@ -76,7 +76,6 @@ Page({
demo9: {
visible: true,
value: Date.now(),
- monthRange: [new Date().getTime(), new Date().getTime()],
},
},
demo3NextMonth() {
@@ -112,4 +111,9 @@ Page({
'demo9.value': this.data.demo9.value + 1000 * 24 * 3600,
});
},
+ demo9HandleInit() {
+ this.setData({
+ 'demo9.value': Date.now(),
+ });
+ },
});
diff --git a/compiled/alipay/src/Calendar/index.ts b/compiled/alipay/src/Calendar/index.ts
index 88b14fa77..cef1c2adb 100644
--- a/compiled/alipay/src/Calendar/index.ts
+++ b/compiled/alipay/src/Calendar/index.ts
@@ -55,6 +55,16 @@ const Calendar = (props: ICalendarProps) => {
const [scrollIntoViewId, setScrollIntoViewId] = useState('');
+ // scroll 触发滚动之后需要重置 scrollIntoViewId
+ function updateScrollIntoViewId(id) {
+ setScrollIntoViewId(id);
+
+ const timer = setTimeout(() => {
+ setScrollIntoViewId('');
+ clearTimeout(timer);
+ });
+ }
+
const selectionModeFromValue = getSelectionModeFromValue(value);
const selectionMode =
props.selectionMode ?? selectionModeFromValue ?? 'range';
@@ -183,7 +193,7 @@ const Calendar = (props: ICalendarProps) => {
useEffect(() => {
// 滚动到已选的位置
props.changedScrollIntoView &&
- setScrollIntoViewId(getScrollIntoViewId(value));
+ updateScrollIntoViewId(getScrollIntoViewId(value));
}, [value]);
useReady(() => {
@@ -191,10 +201,10 @@ const Calendar = (props: ICalendarProps) => {
// 初始化默认值时,滚动到选中位置
const isControl = hasValue(props.value);
if (isControl) {
- setScrollIntoViewId(getScrollIntoViewId(props.value));
+ updateScrollIntoViewId(getScrollIntoViewId(props.value));
} else {
props.defaultValue &&
- setScrollIntoViewId(getScrollIntoViewId(props.defaultValue));
+ updateScrollIntoViewId(getScrollIntoViewId(props.defaultValue));
}
}, []);
@@ -223,4 +233,5 @@ mountComponent(Calendar, {
weekStartsOn: 'Sunday',
localeText: defaultLocaleText,
onFormatter: null,
+ changedScrollIntoView: null,
});
diff --git a/compiled/wechat/demo/pages/Calendar/index.js b/compiled/wechat/demo/pages/Calendar/index.js
index 16b4006fa..060954d99 100644
--- a/compiled/wechat/demo/pages/Calendar/index.js
+++ b/compiled/wechat/demo/pages/Calendar/index.js
@@ -78,7 +78,6 @@ Page({
demo9: {
visible: true,
value: Date.now(),
- monthRange: [new Date().getTime(), new Date().getTime()],
},
},
demo3NextMonth() {
@@ -114,4 +113,9 @@ Page({
'demo9.value': this.data.demo9.value + 1000 * 24 * 3600,
});
},
+ demo9HandleInit() {
+ this.setData({
+ 'demo9.value': Date.now(),
+ });
+ },
});
diff --git a/compiled/wechat/demo/pages/Calendar/index.wxml b/compiled/wechat/demo/pages/Calendar/index.wxml
index 25c0550c2..471e21cc1 100644
--- a/compiled/wechat/demo/pages/Calendar/index.wxml
+++ b/compiled/wechat/demo/pages/Calendar/index.wxml
@@ -89,12 +89,15 @@
-
+
+ selectionMode="single"
+ changedScrollIntoView />
@@ -106,5 +109,11 @@
bind:tap="demo9HandleNextDay">
下一天
+
+ 回到初始化日期
+
diff --git a/compiled/wechat/src/Calendar/index.js b/compiled/wechat/src/Calendar/index.js
index 694bba4d6..135ed896c 100644
--- a/compiled/wechat/src/Calendar/index.js
+++ b/compiled/wechat/src/Calendar/index.js
@@ -55,6 +55,14 @@ var Calendar = function (props) {
value: props.value,
}), value = _c[0], setValue = _c[1];
var _d = useState(''), scrollIntoViewId = _d[0], setScrollIntoViewId = _d[1];
+ // scroll 触发滚动之后需要重置 scrollIntoViewId
+ function updateScrollIntoViewId(id) {
+ setScrollIntoViewId(id);
+ var timer = setTimeout(function () {
+ setScrollIntoViewId('');
+ clearTimeout(timer);
+ });
+ }
var selectionModeFromValue = getSelectionModeFromValue(value);
var selectionMode = (_b = (_a = props.selectionMode) !== null && _a !== void 0 ? _a : selectionModeFromValue) !== null && _b !== void 0 ? _b : 'range';
var triggerEvent = useComponentEvent(props).triggerEvent;
@@ -158,18 +166,18 @@ var Calendar = function (props) {
useEffect(function () {
// 滚动到已选的位置
props.changedScrollIntoView &&
- setScrollIntoViewId(getScrollIntoViewId(value));
+ updateScrollIntoViewId(getScrollIntoViewId(value));
}, [value]);
useReady(function () {
measurement();
// 初始化默认值时,滚动到选中位置
var isControl = hasValue(props.value);
if (isControl) {
- setScrollIntoViewId(getScrollIntoViewId(props.value));
+ updateScrollIntoViewId(getScrollIntoViewId(props.value));
}
else {
props.defaultValue &&
- setScrollIntoViewId(getScrollIntoViewId(props.defaultValue));
+ updateScrollIntoViewId(getScrollIntoViewId(props.defaultValue));
}
}, []);
useEvent('measurement', function () {
@@ -195,4 +203,5 @@ mountComponent(Calendar, {
weekStartsOn: 'Sunday',
localeText: defaultLocaleText,
onFormatter: null,
+ changedScrollIntoView: null,
});
diff --git a/demo/pages/Calendar/index.axml.tsx b/demo/pages/Calendar/index.axml.tsx
index 1fe42693c..b450aa3bc 100644
--- a/demo/pages/Calendar/index.axml.tsx
+++ b/demo/pages/Calendar/index.axml.tsx
@@ -119,12 +119,13 @@ export default ({
{/* 受控模式 */}
{demo9.visible && (
-
+
上一天
@@ -136,6 +137,13 @@ export default ({
>
下一天
+
+ 回到初始化日期
+
)}
diff --git a/demo/pages/Calendar/index.ts b/demo/pages/Calendar/index.ts
index b79407f9d..b90bb8d38 100644
--- a/demo/pages/Calendar/index.ts
+++ b/demo/pages/Calendar/index.ts
@@ -88,7 +88,6 @@ Page({
demo9: {
visible: true,
value: Date.now(),
- monthRange: [new Date().getTime(), new Date().getTime()],
},
},
demo3NextMonth() {
@@ -133,4 +132,9 @@ Page({
'demo9.value': this.data.demo9.value + 1000 * 24 * 3600,
});
},
+ demo9HandleInit() {
+ this.setData({
+ 'demo9.value': Date.now(),
+ });
+ },
});
diff --git a/src/Calendar/index.ts b/src/Calendar/index.ts
index 88b14fa77..cef1c2adb 100644
--- a/src/Calendar/index.ts
+++ b/src/Calendar/index.ts
@@ -55,6 +55,16 @@ const Calendar = (props: ICalendarProps) => {
const [scrollIntoViewId, setScrollIntoViewId] = useState('');
+ // scroll 触发滚动之后需要重置 scrollIntoViewId
+ function updateScrollIntoViewId(id) {
+ setScrollIntoViewId(id);
+
+ const timer = setTimeout(() => {
+ setScrollIntoViewId('');
+ clearTimeout(timer);
+ });
+ }
+
const selectionModeFromValue = getSelectionModeFromValue(value);
const selectionMode =
props.selectionMode ?? selectionModeFromValue ?? 'range';
@@ -183,7 +193,7 @@ const Calendar = (props: ICalendarProps) => {
useEffect(() => {
// 滚动到已选的位置
props.changedScrollIntoView &&
- setScrollIntoViewId(getScrollIntoViewId(value));
+ updateScrollIntoViewId(getScrollIntoViewId(value));
}, [value]);
useReady(() => {
@@ -191,10 +201,10 @@ const Calendar = (props: ICalendarProps) => {
// 初始化默认值时,滚动到选中位置
const isControl = hasValue(props.value);
if (isControl) {
- setScrollIntoViewId(getScrollIntoViewId(props.value));
+ updateScrollIntoViewId(getScrollIntoViewId(props.value));
} else {
props.defaultValue &&
- setScrollIntoViewId(getScrollIntoViewId(props.defaultValue));
+ updateScrollIntoViewId(getScrollIntoViewId(props.defaultValue));
}
}, []);
@@ -223,4 +233,5 @@ mountComponent(Calendar, {
weekStartsOn: 'Sunday',
localeText: defaultLocaleText,
onFormatter: null,
+ changedScrollIntoView: null,
});
diff --git a/tests/alipay/Calendar/__tests__/calendar.spec.ts b/tests/alipay/Calendar/__tests__/calendar.spec.ts
index 579a12ddb..db2fa2309 100644
--- a/tests/alipay/Calendar/__tests__/calendar.spec.ts
+++ b/tests/alipay/Calendar/__tests__/calendar.spec.ts
@@ -314,15 +314,8 @@ describe('Calendar', () => {
extendFunctions.clickCell(
dayjs(defaultValue).add(1, 'd').format('YYYY-MM-DD')
);
- await sleep(300);
- expect(instance.getData().scrollIntoViewId).toEqual(
- getScrollIntoViewId(dayjs(defaultValue).add(1, 'd').toDate().getTime())
- );
- extendFunctions.clickCell('2024-03-28');
await sleep(300);
- expect(instance.getData().scrollIntoViewId).toEqual(
- getScrollIntoViewId(dayjs('2024-03-28').toDate().getTime())
- );
+ expect(instance.getData().scrollIntoViewId).toEqual('');
});
});