I am using React Native's ModalDropdown component for a dropdown menu in my project. I have noticed an issue where, after selecting an option from the dropdown, all options with lower indexes disappear from the dropdown list. I want the dropdown to always display all available options, regardless of the current selection.
Here's my code:
import React, { useState } from 'react';
import ModalDropdown from 'react-native-modal-dropdown';
const RankingPage = () => {
const [selectedOption, setSelectedOption] = useState(null);
const options = ['option1', 'option2', 'option3'];
const handleQuestChange = (index) => {
setSelectedOption(options[index]);
};
return (
<ModalDropdown
options={options}
defaultValue="Select an option ▼"
onSelect={(index) => handleQuestChange(index)}
/>
);
};
I've tried various configurations and properties, but the issue persists. Any help or insights on how to ensure that all options are always visible in the dropdown would be greatly appreciated.
I had the exact same problem just an hour ago and what seemed to work for me was adding saveScrollPosition={false} Before I found this workaround, I saw that by 'dragging' one of the remained options, I was able to restore the list. Hope this will also work for you :)