정의되지 않은 'setState'속성을 읽을 수 없습니다.

Question

flickr api를 사용하여 공용 사진을 가져 와서 이미지 회전식 슬라이드를 만들려고하지만 처음부터 사진을 가져 오지 않으려는 것 같습니다. 내가 React에 처음 온 이래로, 내가 여기서 잘못하고있는 것을 알아 내기가 정말 힘들다. 그래서 어떤 도움을 주시면 감사하겠습니다. 고맙습니다. 반환 위의

는

import React, { Component } from 'react'; 
import ReactDOM from 'react-dom'; 
import axios from 'axios'; 
import _ from 'lodash'; 

import Button from './components/button'; 

const urlArr = []; 
const apiKey = "YOUR_API"; 
const userId = "YOUR_ID"; 
const url = `https://api.flickr.com/services/rest/?method=flickr.people.getPublicPhotos&api_key=${apiKey}&user_id=${userId}&format=json&nojsoncallback=1`; 


class App extends Component { 
    constructor(props) { 
    super(props); 

    this.state = { urlArr: [] }; 

    axios.get(url) 
    .then(function(photoData) { 
     _.forEach(photoData.data.photos.photo, (photo) => { 
     // this.setState({ urlArr: `https://farm6.staticflickr.com//${photo.server}//${photo.id}_${photo.secret}_z.jpg` }); 
     urlArr.push(`https://farm6.staticflickr.com//${photo.server}//${photo.id}_${photo.secret}_z.jpg`); 
     }); 
     this.setState({ urlArr }); 
    }); 
    } 

    render() { 
    return (
     <div> 
     <Button /> 
     </div> 
    ); 
    } 
}; 

ReactDOM.render(<App/>, document.querySelector('.container')); 

코드 '형식 오류 : 부동산 읽을 수 없습니다'는에 ..

Answer 1

당신은 setState를을 (전화하는거야)을 '정의의'setState를하고 나는 그게 무슨 뜻인지 확실히 모르겠어요 약속의 콜백 함수.

이은 반응 성분이 아니기 때문에 오류가 발생했습니다.

화살표 함수를 사용하거나 React Component 인스턴스를 콜백 함수에 바인딩해야합니다. 예를 들어

:

axios.get(url) 
.then((photoData) => { 
    _.forEach(photoData.data.photos.photo, (photo) => { 
    // this.setState({ urlArr: `https://farm6.staticflickr.com//${photo.server}//${photo.id}_${photo.secret}_z.jpg` }); 
    urlArr.push(`https://farm6.staticflickr.com//${photo.server}//${photo.id}_${photo.secret}_z.jpg`); 
    }); 
    this.setState({ urlArr }); 
}); 

또는 :

axios.get(url) 
.then(function(photoData) { 
    _.forEach(photoData.data.photos.photo, (photo) => { 
    // this.setState({ urlArr: `https://farm6.staticflickr.com//${photo.server}//${photo.id}_${photo.secret}_z.jpg` }); 
    urlArr.push(`https://farm6.staticflickr.com//${photo.server}//${photo.id}_${photo.secret}_z.jpg`); 
    }); 
    this.setState({ urlArr }); 
}.bind(this));