Блог

это функция, которая возвращает адрес из долготы и широты ,я получаю данные из базы данных с помощью axios, содержимое адресной ячейки-это не адрес, а значения долготы и широты

 const getaddress = (lng, lat) =gt; {  var latlng = new window.google.maps.LatLng(lat, lng)  // This is making the Geocode request   const geocoder = new window.google.maps.Geocoder()  geocoder.geocode({ 'latLng': latlng }, (results, status) =gt; {  // if (status !== window.google.maps.GeocoderStatus.OK) {  // }  // This is checking to see if the Geoeode Status is OK before proceeding  if (status === window.google.maps.GeocoderStatus.OK) {  console.log(results[3].formatted_address)  return results[3].formatted_address  } else {  console.log('Geocode was not successful for the following reason: '   status)  }  })  }  

 async function getUsers (role, status, phone, nom, id, limit, offset) {  var token = sessionStorage.getItem('token')  // console.log(token)  const dataT = await axios  .get(server   '/v2/profiles/?role='   role   'amp;status='   status   'amp;phone='   phone   'amp;name='   nom   'amp;id='   id   'amp;limit='   limit   'amp;offset='   offset, {  headers: {  Authorization: `Token ${token}`  }  })  .then((response) =gt; {  if (response) {  return response.data  }  })  .catch(() =gt; {  // console.log(error);  })  setData(dataT) }  const columns = [  {  field: 'avatar',  width: 50,  headerName: 'Avatar',  renderCell: (params) =gt; (lt;Avatar src={params.value} /gt;)  },  {  field: 'id',  width: 100,  headerName: 'ID'  },  {  field: 'name',  headerName: 'Nom',  width: 200  },  {  field: 'role',  headerName: 'Rôle',  width: 120,  renderCell: (params) =gt; (lt;Badge color={params.value === 'Transporteur' ? 'primary' : 'info'}gt;{params.value}lt;/Badgegt;)  },  {  field: 'phone',  headerName: 'Téléphone',  width: 130  },  {  field: 'address',  headerName: 'Adresse',  width: 200,  renderCell: (params) =gt; {  getaddress(params.value[0], params.value[1])  }  },  {  field: 'status',  headerName: 'Status',  width: 200,  renderCell: (params) =gt; (lt;Badge color={getcolor(params.value)}gt;{getaccoutStatus(params.value)}lt;/Badgegt;)  },  {  field: 'training_scheduled',  headerName: 'Formation prévue le ',  width: 200,  type: 'datetime',  renderCell: (params) =gt; (params.value ? lt;Badge color='warning'gt;{params.value}lt;/Badgegt; : null)  },  {  field: 'trained_at',  headerName: 'Formation efféctuée le',  width: 200,  type: 'datetime',  renderCell: (params) =gt; (params.value ? lt;Badge color='success'gt;{params.value}lt;/Badgegt; : null)  },  {  field: 'RC',  headerName: 'Regitsre Commerce',  width: 180,  renderCell: (params) =gt; (lt;Badge color={getColors(params.value)}gt;{params.value}lt;/Badgegt;)  },  {  field: 'PC',  headerName: 'Permis de Conduire',  width: 180,  renderCell: (params) =gt; (lt;Badge color={getColors(params.value)}gt;{params.value}lt;/Badgegt;)  },  {  field: 'CJ',  headerName: 'Casier Judiciaire',  width: 180,  renderCell: (params) =gt; (lt;Badge color={getColors(params.value)}gt;{params.value}lt;/Badgegt;)  },  {  field: 'CG',  headerName: 'Carte Grise',  width: 180,  renderCell: (params) =gt; (lt;Badge color={getColors(params.value)}gt;{params.value}lt;/Badgegt;)  },  {  field: 'CT',  headerName: 'Carte de Transport',  width: 180,  renderCell: (params) =gt; (lt;Badge color={getColors(params.value)}gt;{params.value}lt;/Badgegt;)  },  {  field: 'PI',  headerName: 'Permis de Circulation',  width: 180,  renderCell: (params) =gt; (lt;Badge color={getColors(params.value)}gt;{params.value}lt;/Badgegt;)  },  {  field: 'rating_client',  headerName: 'Rating Client',  renderCell: (params) =gt; (  lt;Rating  name='customized-empty'  defaultValue={params.value}  precision={0.5}  emptyIcon={lt;StarBorderIcon /gt;}  readOnly  /gt;),  width: 200  },  {  field: 'rating_driver',  headerName: 'Rating Driver',  renderCell: (params) =gt; (  lt;Rating  name='customized-empty'  defaultValue={params.value}  precision={0.5}  emptyIcon={lt;StarBorderIcon /gt;}  readOnly  /gt;),  width: 200  },  {  field: 'email',  headerName: 'Email',  width: 250  },  {  field: 'payment_method',  headerName: 'Méthode de paiement',  width: 150  },  {  field: 'created_at',  headerName: 'Créé le',  width: 180  },  {  field: 'available_from',  headerName: 'Disponibe de',  width: 150  },  {  field: 'available_to',  headerName: 'Disponible à',  width: 150  },  {  field: 'created_by',  headerName: 'Créé par',  width: 150  } ]   const rows =  (data || []).map((item) =gt; {  return {  avatar: item.picture,  id: item.id,  status: item.account_status,  name: item.last_name   ' '   item.first_name,  rating_driver: item.driver_rating,  rating_client: item.client_rating,  email: item.email,  phone: item.phone,  role: item.is_driver === true ? 'Transporteur' : 'Client',  trained_at: item.trained_at,  training_scheduled: item.training_scheduled,  address: [item.location_longitude, item.location_latitude],  payment_method: item.payment_method === 1 ? 'Postpayé' : 'Prépayé',  created_at: moment(item.created_at).format('YYYY/MM/DD hh:mm'),  // is_active: item.is_active==true ? "Active": "Non Active",  available_from: item.available_from,  available_to: item.available_to,  created_by: item.created_by,  documents: item.documents,  RC: getdoc(getdocument(item.documents), 1),  PC: getdoc(getdocument(item.documents), 2),  CJ: getdoc(getdocument(item.documents), 6),  CG: getdoc(getdocument(item.documents), 7),  CT: getdoc(getdocument(item.documents), 8),  PI: getdoc(getdocument(item.documents), 9)  // actions: item.id  }  })  

я ничего не получаю в адресе столбца , я пытаюсь асинхронно и жду в функции getaddress, но у меня есть некоторые ошибки . реакция задержки возврата функции по сравнению с отображением сетки данных компонента