Обещание возвращает обещание само по себе - PullRequest
0 голосов
/ 07 ноября 2018

Я вызываю функцию getCoordinates(), которую пытаюсь вернуть сами фактические данные, а не обещание. Так, например, если я укажу координаты журнала после того, как позвоню getCoordinates(), я получу следующее ...

Promise {<pending>}
__proto__: Promise
[[PromiseStatus]]: "resolved"
[[PromiseValue]]: Object
lat: 32.8866234
lng: -97.1008832
__proto__: Object

Однако я просто хочу получить свойства lat и lng из getCoordinates()

getCoordinates ()

const getCoordinates = (address) => {
  const convertedAddress = address.address.replace(/ /g, '+')
  return axios.get(`https://maps.googleapis.com/maps/api/geocode/json?address=
  ${convertedAddress}&key=youwerelikeabrothertomeannie`)
    .then(res => { return res.data.results[0].geometry.location })
}

Я хочу передать координаты, которые я получаю в компоненте RegularMap

Компонент отображается

function Map ({...props}) {
  const coordinates = getCoordinates(props)
  console.log(coordinates)
  return (
    <RegularMap
      googleMapURL='https://maps.googleapis.com/maps/api/js?key=jedimaster
      loadingElement={<div style={{height: '100%'}} />}
      containerElement={<div style={{height: '280px'}} />}
      coordinates={coordinates}
      mapElement={<div style={{height: '100%'}} />}
    />

  )
}

Ответы [ 2 ]

0 голосов
/ 07 ноября 2018

В таких ситуациях я люблю использовать async/await для обещаний.

Если у вас есть доступ к ES7, простое добавление этих двух слов решит эту проблему:

async function Map ({...props}) {
  const coordinates = await getCoordinates(props)
  console.log(coordinates)
  return (
    <RegularMap
      googleMapURL='https://maps.googleapis.com/maps/api/js?key=jedimaster
      loadingElement={<div style={{height: '100%'}} />}
      containerElement={<div style={{height: '280px'}} />}
      coordinates={coordinates}
      mapElement={<div style={{height: '100%'}} />}
    />
  )
}
0 голосов
/ 07 ноября 2018

Заставьте вашу getCoordinates функцию возвращать обещание.

const getCoordinates = (address) => {
  const convertedAddress = address.address.replace(/ /g, '+')
  return axios.get(`https://maps.googleapis.com/maps/api/geocode/json?address=
  ${convertedAddress}&key=youwerelikeabrothertomeannie`)
}

Тогда вы можете использовать это так:

getCoordinates('somethinghere')
    .then(resp => {
        //probably set state here
    }).catch(err => {
        // probably console log error here
    })
...