Weird behaviour when more than 65 items in the dropdown

[lbrianza]

Hi, I have the following issue:

I have a dropdown picker that works perfectly fine until the number of items is less than 65. However, if I have more than 65 items, when scrolling down the list something strange occurs and some blank space appears at the end of the list.

Here a snack reproducing the problem: Link

If you open the dropdown menu and scroll down till the end, you will notice the last item disappearing and then blank space appears.

If you remove from the code the last 6 items of the dropdown, instead, the problem disappears.

[hossein-zare]

Hello,

This mostly likely happens because you have a large number of items and each of them contain some complicated logic (RenderListItem.js) so that the app can't handle the process.

Please test it on a real device.

[lbrianza]

Hello,

What do you mean by "contain some complicated logic"?

I tested it also on real device (2 different ones, android and iphone) and the same problem occurs... so there is no way to have more than 65 items in the list?

[hossein-zare]

The RenderListItem.js file handles too many updates sometimes it can't render your items that's why the blank space appears instead of items.

You can create your own RenderListItem component and keep it as simple as possible: https://hossein-zare.github.io/react-native-dropdown-picker-website/docs/advanced/list-and-items#renderlistitem

I will also try to improve the behavior of the component.