feat: 优化卡片滚动问题
This commit is contained in:
36
scripts/regression-card-swiper-gesture.mjs
Normal file
36
scripts/regression-card-swiper-gesture.mjs
Normal file
@@ -0,0 +1,36 @@
|
|||||||
|
import assert from "node:assert/strict";
|
||||||
|
import { readFileSync } from "node:fs";
|
||||||
|
import { dirname, resolve } from "node:path";
|
||||||
|
import { fileURLToPath } from "node:url";
|
||||||
|
|
||||||
|
const scriptDir = dirname(fileURLToPath(import.meta.url));
|
||||||
|
const componentPath = resolve(
|
||||||
|
scriptDir,
|
||||||
|
"../src/pages/Discovery/components/CardSwiper/index.vue"
|
||||||
|
);
|
||||||
|
const source = readFileSync(componentPath, "utf8");
|
||||||
|
|
||||||
|
assert.match(
|
||||||
|
source,
|
||||||
|
/@touchmove\.stop\.prevent="handleTouchMove"/,
|
||||||
|
"CardSwiper should keep native mini-program touchmove capture behavior"
|
||||||
|
);
|
||||||
|
|
||||||
|
const touchStartMatch = source.match(
|
||||||
|
/const\s+handleTouchStart\s*=\s*\(event\)\s*=>\s*{([\s\S]*?)\n};/
|
||||||
|
);
|
||||||
|
|
||||||
|
assert.ok(touchStartMatch, "CardSwiper should define handleTouchStart");
|
||||||
|
|
||||||
|
assert.ok(
|
||||||
|
!/if\s*\([^)]*isRecycling\.value[^)]*\)\s*return/.test(touchStartMatch[1]),
|
||||||
|
"CardSwiper should accept the next touchstart during the recycle frame so quick follow-up swipes are not dropped"
|
||||||
|
);
|
||||||
|
|
||||||
|
assert.ok(
|
||||||
|
/clearFillFadeTimer\(\)/.test(touchStartMatch[1]) &&
|
||||||
|
/clearRecycleTimer\(\)/.test(touchStartMatch[1]) &&
|
||||||
|
/isRecycling\.value\s*=\s*false/.test(touchStartMatch[1]) &&
|
||||||
|
/fillFadeKey\.value\s*=\s*["']["']/.test(touchStartMatch[1]),
|
||||||
|
"CardSwiper should cancel recycle and decorative fill fade before starting a new gesture"
|
||||||
|
);
|
||||||
@@ -432,11 +432,15 @@ const finishSwipe = (step) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const handleTouchStart = (event) => {
|
const handleTouchStart = (event) => {
|
||||||
if (!canSwipe.value || isAnimating.value || isRecycling.value) return;
|
if (!canSwipe.value || isAnimating.value) return;
|
||||||
|
|
||||||
const touch = event.touches?.[0] || event.changedTouches?.[0];
|
const touch = event.touches?.[0] || event.changedTouches?.[0];
|
||||||
if (!touch) return;
|
if (!touch) return;
|
||||||
|
|
||||||
|
clearRecycleTimer();
|
||||||
|
clearFillFadeTimer();
|
||||||
|
isRecycling.value = false;
|
||||||
|
fillFadeKey.value = "";
|
||||||
startX = touch.clientX;
|
startX = touch.clientX;
|
||||||
startY = touch.clientY;
|
startY = touch.clientY;
|
||||||
deltaX.value = 0;
|
deltaX.value = 0;
|
||||||
|
|||||||
Reference in New Issue
Block a user