правильный формат для извлечения данных из API веб-сайтов - PullRequest
0 голосов
/ 04 марта 2019

Я пытаюсь извлечь данные из API веб-сайтов в мое приложение для ответов / листовок.Пока у меня есть данные, возвращаемые в консоли:

    fetch('https://thesession.org/members/nearby?latlon=53,-6&radius=1000&format=json&perpage=50')
          .then(res => res.json())
          .then(members => {
            console.log(members);
            this.setState({
              Nearbymems : members.Nearbymems
            });
          });

Затем я пытаюсь отобразить элементы в качестве маркеров на моей карте, используя следующее:

  {this.state.NearbyMems.map(members => (
           <Marker
                   position={[members.location.latitude, members.location.longitude]}
                   icon={myIcon3} >
              <Popup>
              <em>{members.name}, </em>
                  {members.bio} {'\n'}

                   <PopupModal initialModalState={true}/>
              </Popup>
           </Marker>
         ))}

Пока это не приводит кошибки и мое приложение компилируется и работает без ошибок, маркеры не отображаются.Это пример того, как отображаются возвращаемые данные JSON:

{
"latlon": "53,-6",
"radius": "1000",
"format": "json",
"perpage": "50",
"pages": 108,
"page": 1,
"total": 5391,
"members": [
    {
        "id": 85639,
        "name": "____",
        "url": "https://thesession.org/members/85639",
        "location": {
            "latitude": "____",
            "longitude": "_____"
        },
        "date": "",
        "bio": ""
    },

edit:

Код для myIcon3:

var myIcon3 = L.icon({
    iconUrl: 'http://www.libpng.org/pub/png/img_png/pengbrew_160x160.png',
    iconSize: [25, 51],
    iconAnchor: [12.5, 51],
    popupAnchor: [0, -51],
});

вывод fetch:

Object
  format: "json"
  latlon: "53,-6"
  members: (50) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, 
  {…}, {…}, {…},{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}
  {…}, {…},{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, 
  {…}, {…},{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]
  page:   1
  pages:  108
  perpage: "50"
  radius:  "1000"
  total :   5391
  __proto__: Object

1 Ответ

0 голосов
/ 05 марта 2019

Чтобы решить свой вопрос.Я использовал IP-искатель под названием IPAPI , который требовал от меня форматирования его широты / ширины с помощью:

lng: location.longitude
lat: location.latitude

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

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...