can't open the drop down menu and then see the values

Elly 0
Viewed 30

Hi everyone i have a problem with using a react native method. I can't open the drop down menu and then see the values. When I click on the drop-down menu this does not open and does not show me the values ​​in the list.

export default class AddPost extends Component { 
constructor(props){
  super(props);
  this.state={language:[{label="",value=""}],open:false}
}
 setOpens=()=>{
    this.setState({open:true})
  }
render(){
    return(
      <View style={styles.container}>
      <Text style={styles.paragraph}>
        React native dropdown picker
      </Text>
      <DropDownPicker
          items={[
              {label: 'English', value: 'en'},
              {label: 'Deutsch', value: 'de'},
              {label: 'French', value: 'fr'},
          ]}
          open={this.state.open}
          setOpen={() => this.setOpens()}  
          defaultIndex={0}
          containerStyle={{height: 40}}
          onChangeItem={item => this.state.language(item.label, item.value)}
      />
    </View>
  );
}

I also want to store the selected value of the dropdown menu. What can I do? Why does my drop down menu not open?

drop-down-menu react-native
1 Answers

Hey elly some problems with your code, thats not how you define state and also setState is the method to setState

export default class AddPost extends Component { 
constructor(props){
  super(props);
  //here ive addded : in place of =
  this.state={language:[{label:"",value:""}]}
}
render(){
    return(
      <View style={styles.container}>
      <Text style={styles.paragraph}>
        React native dropdown picker
      </Text>
      <DropDownPicker
          items={[
              {label: 'English', value: 'en'},
              {label: 'Deutsch', value: 'de'},
              {label: 'French', value: 'fr'},
          ]}
          defaultIndex={0}
          containerStyle={{height: 40}}
          onChangeItem={item => {
          
          const newObj = {label:item.label , value:item.value}
          const newArr = [newObj];
          
          this.setState({
          language:newArr
          })
          
          }}
      />
    </View>
  );
}

Hope it helps, feel free for doubts. for further assistance please share expo snack

Gaurav Roy0
Related