React-Native how can i return my json data to my prop?

I have a component and that component should send a json url to my function. Then that function will fetch it and send back it as props so i can see data in props. But even i take data true, when i return it its not going well its always give me that error :

{"dataSource": {"_U": 0, "_V": 0, "_W": null, "_X": null}

My component :

const DropdownComponent =  props => {  console.log('props -->',props)  return (<Picker      dataSource={props.dataSource}      mode="dropdown"      dropdownIconColor="white"      style={styles.touchstyle}      onValueChange={props.onChange()}>        {/* {props.dataSource &&        props.dataSource.map(data => {          return (<Picker.Item              color="black"              key={data.id}              label={data.name}              value={data.id}            />          );        })} */}</Picker>  );};

My component in app:

<DropdownComponent          key="1"              dataSource={getData(   // I need send that url and type and when its fetcher fetch url it should return back data to dataSource'https://api.npoint.io/995de746afde6410e3bd','city',          )}          onChange={onChange}        />   

My Fetcher :

const  getData =  (apiUrl, type) => {      return apiService.getPost(apiUrl,type).then(cz=>{        console.log('cz--->',cz)  // cz is show me my datas when i check console       return cz;       })

My Api Service :

apiService.getPost = async function (url, params) {  const x = fetch(url).then(res => res.json())  return x;

Result on log : https://ibb.co/k5VdN8z ( Also i dont know why props shows before than my function too )

Thanks for reply!