react-component / react-component/resize-observer

Collection的onBatchResize会闭包state

Open
#75 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
201
Forks
47
PR merge metrics
No merged PRs in 30d

Description

可在repo内example/collection.tsx文件的onBatchResize函数内添加console.log({ size1 }),观看demo效果。当多次发生resize时,打印的size1始终是第一次渲染时的size1。

原因应该是src/SingleObserver/index.tsx内,onInternalResize用useCallback做了持久化,如果onCollectionResize发生了更新则无法通知onInternalResize做出更新。因此应该加一个

const onCollectionResizeRef = React.useRef(onCollectionResize); onCollectionResizeRef.current = onCollectionResize;

之类的改造;

或者src/Collection.tsx对onBatchResize用ref包装,onResize依赖传空数组做成持久化。

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with example/collection.tsx and add the reported console.log in onBatchResize to reproduce the stale size1 value. Then read the memoized onInternalResize in src/SingleObserver/index.tsx and the onBatchResize handling in src/Collection.tsx. Done means repeated resizes observe the current callback state rather than the value from the first render.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.