TypeError non capturé (en promesse): Impossible de lire la propriété 'setState' de undefined

Question

Pour moi, cette erreur se produit assez souvent lors de l'utilisation d'axios. Je ne peux pas définir l'état avec une propriété non définie. Même si je reçois une réponse réelle. Je suis assez confus. Toute solution serait appréciée.

json répondre par axios répondre

[ { main: 1,
    left: 0,
    right: 0,
    top: 0,
    bottom: 0,
    cid: 6,
    '$created': '2016-10-21T11:08:08.853Z',
    '$updated': '2016-10-22T07:02:46.662Z',
    stop: 0 } ]

code.js

import React from 'react';
import ReactDOM from 'react-dom';
import axios from 'axios';
    export default class Main extends React.Component{
        constructor(props){
            super(props);
            this.state = {
                status:[]
            }
        }
        componentDidMount(){

            this.getdata()
        }
        getdata(){
            axios.get('/getactions')
                .then(function (data) {
                    console.log(data.data);

                    this.setState({
                        status:data
                    })
                })
        }

        render(){
            console.log(this.state)
            return(
                <div>
                   <button >Left</button>

                </div>
            )
        }
    }


    ReactDOM.render(<Main/>,document.getElementBy

Id('app'))

Answer 1

this au sein d'une fonction standard est généralement déterminé par comment on l'appelle, pas par où la fonction a été créée. Donc this dans la fonction de rappel ici n'est pas la même chose que this en dehors:

getdata(){
    axios.get('/getactions')
        .then(function (data) {
            console.log(data.data);

            this.setState({
                status:data
            })
        })
}

Cependant, les fonctions fléchées se ferment sur le this de leur contexte, donc:

getdata(){
    axios.get('/getactions')
        .then(data => {                // <== Change is here
            console.log(data.data);

            this.setState({
                status:data
            })
        })
}