问题标签 [recyclerlistview]

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 回答
562 浏览

reactjs - 为 RecyclerListView 过滤数据

我正在尝试使用 RecyclerListView 实现带有过滤器的基本列表。但是一旦键入一些文本并且滚动不在顶部,它就会抛出异常 No layout available for index.

看这个小吃https://snack.expo.io/SJY6NU00B

复制说明:

  1. 滚动到底部
  2. 在 TextInput 中输入字母“A”

结果 :

没有可用于索引的布局:233 LayoutUnavailableException:没有可用于索引的布局:233 at new e (module://recyclerlistview.js:3:1527) at e.getOffsetForIndex (module://recyclerlistview.js:3:5917) at t.refreshWithAnchor (module://recyclerlistview.js:3:26794) 在 e._checkAndChangeLayouts (module://recyclerlistview.js:3:16117) 在 e.componentWillReceiveProps (module://recyclerlistview.js:3:11983)在 Hi ([snack internals] at ha ([snack internals] at Js ([snack internals] at js ([snack internals] at Ps ( https://s3.us-west-1.amazonaws.com/snack-web -player/36/static/js/2.d51b9d02.chunk.js:1:1086639 )

我做错了吗?

0 投票
2 回答
3419 浏览

reactjs - RecyclerListView 使用功能组件滚动到顶部 onEndReached

我已经使用 Redux 实现了一个RecyclerListViewFlipkart Github),如下所示。一切似乎都运行良好,除非当onEndReached被调用并且新一批数据通过时,列表被定位到页面顶部而不是保持平滑。在下面的 GIF 中查看该行为:

注意:这发生在 web(chrome) 上。我尝试了最新的稳定版和 2.0.13-alpha.1


更新:我可以确认基于类的版本使用 redux connect 没有问题。倾向于这是与图书馆的某种不兼容。不过很有趣。

下面的代码片段是这个演示的简化工作示例https://codesandbox.io/s/k54j2zx977

0 投票
0 回答
182 浏览

javascript - react native onEndReached中的Recyclerlistview不断触发

在滚动一次时,只要列表中有新数据,onEndReached 就会一直触发。这是我的代码

这是 onEndReached 触发的函数

而 onEndReachThreshold 为 0.1 并尝试更改值但没有效果。请帮忙

0 投票
0 回答
158 浏览

react-native - 滚动列表时将本机滚动反应到偏移量

我正在尝试在本机反应中实现静态列表大小的分页(即)将具有静态列表大小,并且基于阈值滚动(例如达到 80% 的列表可见性)将在底部添加更多项目并从顶部删除列表项目。向上滚动时的相同方式将在顶部添加列表项并在底部删除。

我面临的问题是,在滚动 listRef.scrollToOffSet 时(我使用 getLayout 道具找出要调整的高度)不起作用。如果我在开发测试时添加调试器,它工作正常。但是如果没有调试器,列表不会移动到指定的偏移量。

你能帮我弄清楚如何实施吗?

0 投票
0 回答
337 浏览

javascript - 滚动进或出帧时如何在recyclerlistview中停止/播放视频

我正在尝试在 Expo React Native 中创建 TikTok 风格的滑动。我正在使用启用了分页的 recylerlistview,效果很好。我正在使用 json 文件来模拟在滚动结束时加载更多数据。我被困在一些事情上。

  1. 我只希望实际加载当前 + 下一个视频。即使我的窗口大小是 5,我也不想加载那么多视频。
  2. 我希望视频在可见时播放,视频在不可见时立即停止。

我尝试过使用索引,但我的知识在这里不足。只是寻找一些指示,也许是一个帮助我学习的例子。

这是一个可以玩的零食:https ://snack.expo.io/@buzzcore/e3667a

先感谢您

0 投票
0 回答
408 浏览

javascript - ReactNative recyclerlistview 项目之间的空间增加或重叠

我正在使用 ReactNative RecyclerListView 开发 android 应用程序,用于在我的应用程序中显示项目列表。请在渲染函数中检查我的 recyclerlistview 代码。

以下是 _layoutProvider 逻辑。

如果我使用固定高度,则 UI 显示在所有分辨率下都不相同。我使用了 forceNonDeterministicRendering属性。但问题是当我从这个屏幕回到这个屏幕时,项目差距越来越大。如果我在 layoutProvider 中减小高度,则该项目的底部与下一个项目重叠。请检查屏幕截图以供参考。

两个项目之间的空间增加当第一次使其正常工作时没有任何问题。请帮我解决这个问题。提前致谢..

0 投票
0 回答
472 浏览

javascript - 取消组件卸载时的 graphQL 调用

我在 React 本机组件中使用下面的 @apollo/GraphQL 查询

一旦我有了数据,我就使用 RecyclerListView 来呈现列表。

问题:由于它的异步调用(useLazyQuery),所以如果用户快速更改视图(通过单击按钮),我会遇到以下错误。

如何在组件卸载时取消 useLazyQuery。

0 投票
1 回答
439 浏览

performance - 当一个项目需要很长时间渲染并产生空白区域时,如何在 Flatlist 的空白区域加载加载器?

我想在空白的空白处加载加载器。因为在快速滚动期间,Flatlist 会留下看起来很奇怪的空白。而那些空白需要时间来渲染原始项目。

0 投票
1 回答
393 浏览

reactjs - Load React Native Recyclerlistview 上的闪烁问题

我已经从 Flatlist 切换到 Flipkart 的 RecyclerlistView。但是像 onload 和 onscroll 这样的事件存在一些行渲染闪烁问题,这似乎很奇怪。有人对此有任何解决办法吗?

这是代码:

0 投票
2 回答
400 浏览

android - 用刀柄注入 viewModel

我想用 Hilt 将我的 viewModel 注入到 RecyclerView 中。它可以被注入,但当 recyclerView 被销毁时 viewModel 不会被销毁。用刀柄在 recyclerView 中注入 viewModel 的最佳方法是什么?