問題タブ [scrolltoindex]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
435 参照

react-native - scrollToIndex が RTL FlatList React-Native で機能しない

Horizo​​ntal FlatList がありますが、電話の言語をアラビア語 (RTL) に変更しました。scrollToIndex() は RTL では機能しません。RTL がなくても期待どおりに機能します。助言がありますか?

フラットリスト

Press() の renderItem 関数はアイテム ID を渡しています

前もって感謝します。

0 投票する
2 に答える
1253 参照

react-native - FlatList scrollToIndex メソッドが正しいインデックスにスクロールしない

実際の動作:

私は反応ネイティブでポッドキャスト再生アプリケーションに取り組んでおり、それにトラックプレーヤーを実装しています。プレーヤー画面でポッドキャストを再生するときに、次のアイコンを 2 回タップし、現在プレーヤー画面で再生されているポッドキャストのトピック画面に移動すると、FlatList から再生されているポッドキャスト アイテムまでスクロールする必要があります。トピック画面をハイライト表示します。

このために、FlatList のscrollToIndexメソッドを FlatList のgetItemLayout prop と組み合わせて使用​​し、現在再生中のポッドキャスト アイテムのインデックスをメソッドに渡しました。しかし、メソッドは期待どおりに機能せず、間違った位置にスクロールしています。また、役に立たない多くの回避策を試しました。

予想される動作:

プレーヤー画面のトピック画面から再生中の特定のポッドキャスト項目までスクロールし、それを強調表示することになっています。誰か助けてください。前もって感謝します。

私が試したこと:

環境 :

"react": "16.8.3", "react-native": "0.59.9", "MacOS": "10.15.3"

0 投票する
0 に答える
487 参照

reactjs - scrollToIndex 最後のアイテムから最初のアイテムまでのフラットリストにより、空の画面が表示される

React Native では、「scrollToIndex」を使用してフラットリストをスクロールしようとしています。これは、最後のページの 1 つから最初のページ (インデックス 0) に移動するまでは問題なく機能します。次に、「renderItem」が呼び出されず、フラットリストによってレンダリングされると予想されるページ/アイテムではなく、空のページが表示されます。

私が取ったステップ:

最初に、コンポーネントにフック ref を作成しました。 const flatListRef = React.createRef();

次に、フラットリストをコンポーネント レンダリングに追加しました。

次に、フラットリストをインデックス 8 から 0 にスクロールする useEffect を追加しました。

そして最後に、フラットリストのデータを追加しました:

予想される動作: 最後のページが読み込まれ、5 秒後に最初のアイテム/ページ (インデックス 0) が開かれ、正常にレンダリングされます。

実際の動作: 最後のページをロードし、5 秒後に最初のページを開きますが、フラットリストは「renderItem」を呼び出さないため、空のページが表示されます。

スナックの例