Camille
Camille

Reputation: 11

React Native ModalDropdown hides options with lower indexes after selection

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.

Upvotes: 1

Views: 583

Answers (1)

Andrei Dediu
Andrei Dediu

Reputation: 31

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 :)

Upvotes: 3

Related Questions