react native dropdown code example

Example 1: picker change event react native

 setSelectedValue(itemValue)}
      >
        
        
      

Example 2: react native dropdown

// How to install
npm install --save react-native-material-dropdown

// How to use
import React, { Component } from 'react';
import { Dropdown } from 'react-native-material-dropdown';

class Example extends Component {
  render() {
    let data = [
      {      value: 'Banana',    },
      {      value: 'Mango',    },
      {      value: 'Pear',    }];
    
    return (      
          
		);  
	}
}

Example 3: how to make your own drop down react native

import React, { Component } from "react";
import { Picker, View, Text, StyleSheet } from "react-native";

export default class CategoryScreen extends Component {
  state = {
    selectedcat: "",
    category: [
      {
        itemName: "Samsung M20"
      },
      {
        itemName: "Nokia"
      },
      {
        itemName: "Apple"
      },
      {
        itemName: "Samsung M23"
      },
      {
        itemName: "Samsung M24"
      },
      {
        itemName: "Samsung M25"
      }
    ]
  };

  async onValueChangeCat(value) {
    this.setState({ selectedcat: value });
  }

  render() {
    return (
      
        
          Categories
        
        
          
            {this.state.category.map((item, index) => (
              
            ))}
          
        
      
    );
  }
}

const styles = StyleSheet.create({
  viewStyle: {
    flex: 1,
    alignSelf: "center",
    flexDirection: "row",
    width: "92%",
    justifyContent: "space-between",
    alignItems: "center"
  },
  itemStyle: {
    fontSize: 10,
    fontFamily: "Roboto-Regular",
    color: "#007aff"
  },
  pickerStyle: {
    width: "100%",
    height: 40,
    color: "#007aff",
    fontSize: 14,
    fontFamily: "Roboto-Regular"
  },
  textStyle: {
    fontSize: 14,
    fontFamily: "Roboto-Regular"
  }
});