Unable to select multiple values

im having problems when I want to select multiple items. When I select one option they throw me this error: TypeError: Invalid attempt to spread non-iterable instance. In order to be iterable, non-array objects must have a Symbol.iterator method.

Anyone know how to solved this problem??

im using the version: “react-native-dropdown-picker”: “^5.1.21” here is what im doing:

export default class Example extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            openCurrencyDropDown: false,
            data: [
                { label: 'Op1', value: "Op1" },
                { label: 'Op2', value: "Op2" },
                { label: 'Op3', value: "Op3" },
                { label: 'Op4', value: "Op4" },
                { label: 'Op5', value: "Op5" },
                { label: 'Op6', value: "Op6" },
            ],
            value: [],
        }
        this.setValue = this.setValue.bind(this);
    }

   setValue(callback) {
        this.setState(state => ({
            value: callback(state.value)
        }));
    }

    render() {
             <DropDownPicker
                   listMode={'MODAL'}
                   multiple={true}
                   min={0}
                   max={5}
                   open={this.state.openCurrencyDropDown}
                   setOpen={this.setOpenCurrencyDropDown}
                   setValue={this.setValue}
                   items={this.state.data}
                   defaultValue={this.state.value}
                />
    }
}

[hossein-zare]

@kjoonas1 Note that your state variable (value) must be an array []

Follow the official example: https://hossein-zare.github.io/react-native-dropdown-picker-website/docs/usage/#multiple-items

[hossein-zare]

@kjoonas1 Interesting! setValue’s callback always gets the current value, The value variable isn’t undefined while the value param in the callback is undefined.

setValue(state => {

});

The value doesn’t change until you press an item, There’s something wrong on your side i believe.

I encourage you to try firing the setValue in a useEffect:

export const Selector = ({...}) => {
  useEffect(() => {
    setValue(state => {
      console.log("setValue callback value", state);

      return state;
    });
  }, []);

  ...

Don’t forget to restart your app after the changes.