callstack / callstack/react-native-pager-view

Delay/Flicker in View when setting State in onPageSelected

オープン
#766 コメント 3 件 リアクション 1 件 担当者 0 名 GitHub で見る
question
主要言語
TypeScript
スター
3.4k
フォーク
476
平均マージ
10日 21時間
マージ済み PR(30日)
2

説明

I've created a PagerView with an onPageSelected callback:

```
const [index, setIndex] = useState(0);
```

```


First page


Second page


```

```
const onPageSelected = (event) => {
const {position} = event.nativeEvent;
if(position !== index) {
setIndex(position);
}
}
```

When i change view, there is a small delay. I've traced it back to the `setIndex()` useState.
I want to use the index to show different button styles based on if it is the active view or not.

How do i get around this?
When i remove the setIndex(), its super smooth, but I dont have access to the current active page.
Can i get the current active page from the ref? Is there a better way to implement this?

コントリビューションガイド

コントリビューションガイドを開く

調査の方向性

Issue の例に示されている PagerView の onPageSelected callback と setIndex useState から始めます。ページを変更したときの遅延を再現し、その後 ref とイベントの動作を調べて、state の更新をレンダリングせずに現在アクティブなページを取得できるかどうかを確認します。報告されているちらつきなしにアクティブページのボタンのスタイルを更新する、サポートされた方法を文書化または実装できれば完了です。

索引モデルが issue の本文から書いたものです。

評価

技術スタック
react-native
領域
mobile
issue の種類
バグ
難易度
3/5
見積もり時間
1〜2日
活発さ
停滞
明瞭さ
説明が足りない
初心者へのやさしさ
35/100

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。