Fix resize handler: use ref to avoid stale closure and listener churn
Register resize listener once with empty deps; track left via ref so the debounced callback always reads the current offset without re-registering on every click. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
b0eaca462f
commit
b41113f318
1 changed files with 22 additions and 1 deletions
|
|
@ -1,5 +1,5 @@
|
|||
import { h, render } from "https://esm.sh/preact@10";
|
||||
import { useState, useRef } from "https://esm.sh/preact@10/hooks";
|
||||
import { useState, useEffect, useRef } from "https://esm.sh/preact@10/hooks";
|
||||
import { html } from "https://esm.sh/htm@3/preact";
|
||||
|
||||
const TESTIMONIALS = [
|
||||
|
|
@ -54,6 +54,27 @@ function Testimonials() {
|
|||
setLeft(function (l) { return Math.max(-maxL, l - STEP); });
|
||||
};
|
||||
|
||||
var leftRef = useRef(left);
|
||||
leftRef.current = left;
|
||||
|
||||
useEffect(function () {
|
||||
var timer;
|
||||
function onResize() {
|
||||
clearTimeout(timer);
|
||||
timer = setTimeout(function () {
|
||||
var max = measureMax();
|
||||
if (-leftRef.current > max) {
|
||||
setLeft(-max);
|
||||
}
|
||||
}, 150);
|
||||
}
|
||||
window.addEventListener("resize", onResize);
|
||||
return function () {
|
||||
clearTimeout(timer);
|
||||
window.removeEventListener("resize", onResize);
|
||||
};
|
||||
}, []);
|
||||
|
||||
var atStart = left >= 0;
|
||||
|
||||
return html`
|
||||
|
|
|
|||
Loading…
Reference in a new issue