scrollToIndexはリアクション仮想化リストのリストをスクロールしません

Question

react-virtualizedで、listをスクロールして同じscrollToIndexをスクロールすると、同じインデックスにスクロールしません。

リストをその位置に戻す方法はありますか？

Answer 1

これは、小道具が変更されていないためです。 scrollToCellまたはscrollToRowメソッド（グリッドまたはリスト/テーブルを使用しているかどうかに応じて）を使用して、同じインデックスに再スクロールできます。

Answer 2

@brianvaughnも反応仮想化されたリストコンポーネントの小道具は変更されていないので、Listはインデックスに再びスクロールしないと言いました。

デフォルトでは、すべてのコンポーネントがreact-virtualizedpropsまたはstateが変更されない限り、再レンダリングを避けるためにshallowCompareを使用し、以来。更新が行われるまでコンポーネントは再レンダリングされません。

に外部の変更があることを知らせることです。これは2つの異なる方法で行うことができます。

またそのあなたがreact-virtualizedは何かがshallowCompare方法がさえあれば、どんな小道具への変更を検出します

パススルー小道具

を変更したことを知っているようには二つの方法を持っているドキュメントに記載propTypeとして宣言されていません。つまり、セルのレンダリングに影響を与える追加のプロパティを渡して、変更が確実に検出されるようにすることもできます。したがって、virtualizedのリストで何も変更されないイベントを発生させたときに変更される追加の小道具を渡すことができます。

<List 
    {...listProps} 
    sortBy={sortBy} 
/> 

公開方法

グリッドとコレクションコンポーネントが強制的にforceUpdateを使用して再レンダリングすることができます。テーブルとリストについては、forceUpdateGridに電話して、内部グリッドも更新されていることを確認する必要があります。

scrollToIndexを更新する場合は、その値が以前の値から変更されていない場合は、リストのforceUpdateGridを呼び出すことができます。このメソッドは他の多くの状況でも便利です。

scrollToIndexが変更されていない場合は、スクロールイベントを強制する別のオプションが常に存在するため、常に最適なオプションではない可能性があります。 scrollToRowオプション。ただし、スクロールする行が表示される必要があります。それは、あなたはそれを使用することはできません。

にScrollToRow（インデックス：数）

行が表示されていることを確認します。このメソッドは、以前に にスクロールされていたとしても、ユーザーがスクロールしたセルに を安全にスクロールバックするために使用できます。