问题标签 [flatlist]

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

reactjs - 选择项目后如何保持滚动位置反应原生平面列表

找到答案 - 与围绕某些项目的样式组件有关

每当我有一个长列表并且我向下滚动以选择一个项目时,选择后它会跳回顶部。我怎样才能使它在选择后,屏幕不改变?

当试图对此进行更多研究时,我得到了这个问题的搜索结果,但是当添加新项目或如何实现无限滚动时,这不是这里的情况。

我尝试将 ref 分配给平面列表,并在通过选择一个项目触发动作后,滚动到最后保存的位置,但这并没有改变任何内容。

0 投票
2 回答
29 浏览

react-native - React-native Flatlist,在 ScroolToTop 或 ScroolToBottom 时运行函数

我想在scrollToTop 时运行function1() 并在flatlist 中scrollToBottom 时运行函数。我可以这样做吗?

我想做的事情,当我想在平面列表中向下滚动时,我想隐藏顶栏,当我想向上滚动时,我想显示顶栏。

0 投票
2 回答
445 浏览

arrays - 轻按平板列表单项选择

我试图在用户点击它后立即更改平面列表项的背景颜色。这里的问题是数组已更新,但该选定项目的背景颜色未更改。

我想要做的是-单击平面列表项后,该行的背景颜色应该会改变,但不会改变。以下是我尝试过的代码。

0 投票
2 回答
43 浏览

javascript - 如何在 FlatList 中选择单个项目

我正在尝试在 FlatList 中选择单个项目。所需的功能是单击取消关注,并且已单击的特定项目从“取消关注”更改为“关注”。到目前为止,我已经设法完成了这个功能,但问题是当我手动重新渲染组件时进行了更改。

这是代码:

0 投票
1 回答
183 浏览

react-native - 当 numColumns 为 3 时处理 flatlist 中的空格

我在平面列表中有 numColumns 3。我希望我的平面列表显示为

不是

如果我的数据是数据%3==2

这是我的代码

我组件的宽度是 (width-6)/3 所以它需要 3 px 空间

0 投票
1 回答
752 浏览

react-native - 即使使用 React.memo 也会重新渲染 FlatList 项目

我正在尝试使用 FlatList 组件呈现 React Native 中的项目列表,但每次我获取新数据时,它都会重新呈现项目列表,即使使用 React.memo。

这是我的代码的样子:

组件.js

每次onEndReached触发该函数并调用 loadMore 函数时,所有 FlatList 项目都会重新渲染,它每次都会 console.log '我正在渲染'并导致错误virtualizedlist you have a large list that is slow to update

感谢任何可以帮助我的人!

0 投票
1 回答
27 浏览

react-native - 我的 redux 道具在从 flatList onRefresh 访问后给了我空数据

reload如果我第一次通过它调用我的方法,useEffect它包含我的数据,但如果我onRefresh在运行时调用 via,它会给我空数据。

为什么?我应该如何保存它?onRefresh调用哪个线程有问题吗?

有关我的项目的更多信息,请查看这个问题,也许是同一个问题。

0 投票
2 回答
443 浏览

javascript - 如何解决FlatList React native中的Key问题

这是我第一次使用 React,我的程序中有这个问题。请你帮帮我好吗?我在我的应用程序中使用 TMDB API。

任何提议

0 投票
0 回答
87 浏览

react-native - 网格视图大小设置中的平面列表项

我正在使用 flatlist 并且我正在使用 2 列问题是项目的高度每次都不同,因为它会根据内容进行调整,然后在每个项目的下方留下空间。所以我正在寻找一种解决方案,以便项目将在另一个项目之前自动调整,并且不保持比例来调整项目。

0 投票
3 回答
312 浏览

react-native - 无法为 FlatList 项目分配宽度

我在为 FlatList 中包含的卡片分配宽度时遇到问题。我尝试使用 为 FlatList 列分配 50% 的宽度columnWrapperStyle={{ width: "50%" }},但它不起作用。

我正在使用 FlatList 在两列中显示卡片列表

项目FavCard的样式如下:

FavouriteCocktailsContainer

这就是我得到的:

在此处输入图像描述

我希望卡片的宽度为FavouriteCocktailsContainer的 50% ,你知道我该如何解决这个问题吗?先感谢您