Ошибка анонимной функции при нажатии маркера API Карт Google - PullRequest
Новая
       22

Ошибка анонимной функции при нажатии маркера API Карт Google

0 голосов
/ 18 октября 2018

Используя API Google Maps Foursquare, моя цель - использовать свойство фотографии места, предоставленное Foursquare, и, если оно доступно в метаданных места, отобразить его вместе с названием места в информационном окне API Карт Google.Если доступно только одно из двух свойств, я хочу отобразить только доступное.Если venueInfo не определено или ни одно из свойств не доступно, я хочу просто отобразить «Информация недоступна» в информационном окне.Я попытался сделать это с условным оператором с несколькими условиями.

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

enter image description here

Я не понимаю, что не так или как это исправить.Если свойство 'name' не определено, не должно ли условное выражение просто вернуться к отображению "Информация недоступна"?И если информация о маркере ранее отображалась нормально, как она может перестать работать, когда я снова нажимаю на тот же маркер?

Вот мое условное утверждение для рендеринга внутри информационного окна: 

            <InfoWindow>
        {venueInfo.name && venueInfo.bestPhoto ?
          <Fragment>
            <p>{venueInfo.name}</p>
            <img src={`${venueInfo.bestPhoto.prefix}200x200${venueInfo.bestPhoto.suffix}`}
            alt={"Venue"}
            />
          </Fragment> : venueInfo.name ? <p>{venueInfo.name}</p> : venueInfo && venueInfo.bestPhoto ? <img    src={`${venueInfo.bestPhoto.prefix}200x200${venueInfo.bestPhoto.suffix}`}
          // Screen readers already announce as image; don't need the word "image", "photo", etc.
          alt={"Venue"}
        /> : <p>No info available</p>}
      </InfoWindow>

Для справки вот полный код компонента на GitHub.

Ответы [ 2 ]

0 голосов
/ 18 октября 2018

Я думаю, что вы должны проверить этот вывод, вы фильтруете prop.venues, чтобы получить venueInfo, поэтому сначала проверьте venueInfo, чтобы убедиться, что у него есть свойство bestPhoto, и проверьте props.markers в строке 13, чтобы подтвердить свойство marker.id.

const venueInfo = props.venues.find(venue => venue.id === marker.id);

Иногда «фотография для этого маркера отображается нормально», я думаю, что проблема по-прежнему из-за реквизита, свойство photo иногда корректно, поэтому оно работает нормально.

0 голосов
/ 18 октября 2018

Ошибка, которую вы получаете, вызвана попыткой доступа к свойству со значением, которое не определено.

В вашем случае это означает, что venueInfo фактически не определено при попытке доступа к venuInfo.bestPhoto.Который вызвал бы сбой, а не условный оператор.

...