How to fetch api data in Dropdown options in React Native expo Dynamically

I am new to React-Native and having some problems to fetch the api data in the dropdown List.Basically I want to fetch the names from the API and display it in the drop down .For a while i have added to countries .Below is my code for the same.I just want to fetch the name of the employee from the api .

import DropDownPicker from 'react-native-dropdown-picker';export default class ImageScreen extends React.Component {    static navigationOptions = ({ navigation }) => {    return {      title: "Source Listing",      headerStyle: {backgroundColor: "#000"},      headerTitleStyle: {textAlign: "center",flex: 1}     };    };    constructor(props) {     super(props);     this.state = {       loading: true,       dataSource:[]      };    }    componentDidMount(){    fetch("https://jsonplaceholder.typicode.com/users")  // **Api for fetching**    .then(response => response.json())    .then((responseJson)=> {      this.setState({       loading: false,       dataSource: responseJson      })    })    .catch(error=>console.log(error)) //to catch the errors if any    }    FlatListItemSeparator = () => {    return (<View style={{         height: .5,         width:"100%",         backgroundColor:"rgba(0,0,0,0.5)",    }}    />    );    }    renderItem=(data)=><TouchableOpacity style={styles.list}><Text style={styles.lightText}>{data.item.name}</Text><Text style={styles.lightText}>{data.item.email}</Text><Text style={styles.lightText}>{data.item.company.name}</Text></TouchableOpacity>    render(){     if(this.state.loading){      return( <View style={styles.loader}> <ActivityIndicator size="large" color="#0c9"/></View>    )}    return(<View style={styles.container}><ModernHeader title = "Contact us " /><DropDownPicker style = { {alignItems : "center"   , justifyContent :"center"}}  items={[        {label: {data.item.name}, value:  {data.item.name}} **Dropdown list option**    ]}    defaultValue={this.state.country}    containerStyle={{height: 50,width:375}}    style={{backgroundColor: '#fafafa',borderWidth: 4,    borderColor: "#ffa726",    borderRadius: 6,fontSize: 30}}    dropDownStyle={{backgroundColor: '#fafafa'}}    searchable={true}    searchablePlaceholder="Search..."    searchableError="Not Found"    onChangeItem={item => this.setState({        country: item.value    },    console.log(item.value)    )  }     /></View>    )}    }

Any Help is Appreiciated