scrollview内部的本机flatlist react facies gust lag
因此，我有一个用户可以用来填充数组的屏幕，然后将其传递到一个lactlist列表中，然后将上述数组用于其数据密钥，我希望这些flatlist项目垂直出现，并且随着每个新项目的添加，它将展开它所在的容器，将每个项目彼此堆叠在一起。
示例：doordash;假设您在餐厅的页面上，并且可以在整个菜单上垂直显示每个菜单项时都可以上下滚动。
我试图实现的是在滚动浏览中的固定列表，并在上述flatlist上设置为false，但是，当我填充flatlist的数据阵列以及scrollview时，这会导致模拟器中的巨大滞后您到达页面的底部。
const [items, setItems] = React.useState([])
const [newItem, setNewItem] = React.useState(newItem)
const newItem = [
{
name: null,
about: null,
picture: null,
price: null
}]
<ScrollView>
<SafeAreaView>
<FlatList
data={items}
keyExtractor{(item, index) => index.toString()}
scrollEnabled={false}
renderItem={renderItems()}
/>
</SafeAreaView>
</ScrollView>
如您所见，在将新项目添加到flatlist中时，用户最终会操纵newitem，这很好，在ScollView开始向下扩展后，它只是开始滞后应用程序。
感谢您的帮助，如果需要，我可以提供更多澄清。
edit ：为参考，这是渲染时的flatlist项目的样子：
< img src =“ https://i.sstatic.net/ynjxn.png” alt =“在此处输入图像说明”>
所以我实际上是在寻找一种能够在一个同时在滚动浏览中同时而不会滞后的列表吗？
So I have a screen that users can use to populate an array, which then is passed into a FlatList then uses said array for its data key, and I want these FlatList items to appear vertically, and with each new item added, it will expand the container that it is in, stacking each item on top of one another.
EXAMPLE: DoorDash; say you're on a restaurant's page and you're able to scroll up and down throughout it as it displays each menu item vertically.
What I attempted to implement was a FlatList inside of a ScrollView with scrollEnabled set to false on said FlatList, however, this causes immense lag within the emulator when I populate the data array for the FlatList, as well as the ScrollView jumping up and down when you reach the bottom of the page.
const [items, setItems] = React.useState([])
const [newItem, setNewItem] = React.useState(newItem)
const newItem = [
{
name: null,
about: null,
picture: null,
price: null
}]
<ScrollView>
<SafeAreaView>
<FlatList
data={items}
keyExtractor{(item, index) => index.toString()}
scrollEnabled={false}
renderItem={renderItems()}
/>
</SafeAreaView>
</ScrollView>
As you can see, the user will end up manipulating newItem when adding a new item into the FlatList, which works perfectly fine, it just begins to lag the application after the ScollView begins to expand downward.
Thanks for the assistance, and I can provide more clarification if needed.
EDIT: For reference, this is what the FlatList items look like when rendered:
So I'm essentially looking for a method to be able to lazy load dynamic array objects in a flatlist that is simultaneously in a ScrollView without lagging, is it possible?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
同一滞后
在我的情况下，我给了Scrollview Marginbottom的
，为80，而Flatlist处于ScrollView的底部，在从Scrollview中删除Marginbottom后，flatlist faclview引起了滞后问题，Flatlist开始工作正常，您可以尝试提供一些适当的高度来添加flatlist并添加flatlist并添加flatlist并添加一些高度nestedscrollenabled = {true} to scrollView和flatlist
In my case the same lag was also happening
I had given scrollView marginBottom to be 80, and flatList was at bottom of scrollView that caused lag issue after removing marginBottom from scrollView, flatList started working fine
You can try giving some proper height to flatlist and adding nestedScrollEnabled={true} to both scrollView and flatList