홈>
웹 사이트 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": ""
},
수정 :
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],
});
가져 오기 출력 :
Object
format: "json"
latlon: "53,-6"
members: (50) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…},
{…}, {…}, {…},{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}
{…}, {…},{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…},
{…}, {…},{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]
page: 1
pages: 108
perpage: "50"
radius: "1000"
total : 5391
__proto__: Object
- 답변 # 1
관련 자료
- json - 파이썬 - 올바른 형식이 아닌 목록
- textbox - 입력 문자열의 형식이 잘못되었습니다 vbnet
- if statement - 루비로 조건을 작성하고 HAML 태그 내부의 문자열 보간을 사용하여 출력을 문자열로 변환하기위한 올바른 형식
- mysql - 명령문에서 유효하지 않은 문자가 발생하지 않도록 문자열 형식을 수정하는 방법은 무엇입니까?
- 우편 배달부 - 올바른 날짜 형식을 갖도록 응답을 확인하는 방법
- rest - GitHub 페이지에서 올바른 JSON API 형식
- scala - Spark에서 밀리 초 형식의 올바른 타임 스탬프
- quantmod가 올바른 형식으로 데이터를로드하는 데 어려움
- bash - Codenvy의 명령에 대한 올바른 형식
- vb.net - systemformatexception 수정하는 방법 - '입력 문자열이 올바른 형식이 아닙니다'
- php - 날짜 형식이 정확하고 데이터가 저장되었지만 여전히 오류가 발생하는 동안 라 라벨에서 데이터 누락 오류
- 파이썬에서 사용자 입력이 올바른 형식인지 확인하는 방법
- dart - Flutter의 showTimePicker 형식 수정 (Flutter Web)
- objective c - NSKeyedArchiver를 사용하여 사용자 정의 클래스를 아카이브하는 중 "올바른 형식이 아니기 때문에 데이터를 쓸 수 없습니다"
- r - 넓은 형식에서 긴 형식으로 데이터를 녹이지만 정확한 날짜를 사용하는 방법
- c# - systemformatexception - '입력 문자열의 형식이 올바르지 않습니다'
- python - Keras에서 출력이 LSTM을 사용하는 8 개 클래스 중 하나 일 때 y_train의 올바른 형식은 무엇입니까?
- powershell - 소스 코드에서 저장소를 빌드하려고 할 때 "find - 매개 변수 형식이 make에서 올바르지 않음"이 표시됨
- javascript - vuejs에서 배열을 테이블 행으로 나열하는 올바른 형식
- xcode - Swift 42 데이터가 올바른 형식이 아니기 때문에 읽을 수 없습니다
내 자신의 질문을 해결하기 위해.IPAPI라는 IP 파인더를 사용하여 다음과 같이 위도/경도 형식을 지정해야했습니다.
이 기능은 Google의 내장 위치 요청을 거부 한 경우 사용자 IP를 포착하는 것입니다. 그 이후로이 기능을 제거했으며 fetch 문은 이제 올바른 데이터를 반환합니다.