Node.js 在react中更新状态时出错

尝试从函数更新状态并从

componentdidmount

lifecycle方法调用函数时，状态不会更新。 但是当我试图通过从jsx内部调用函数来更新状态时，它确实起作用。我不知道发生了什么事

//my state
constructor(){
    super()
    this.state = {
        activepage:'dashboard',
        language:[],
    }
}

//the function I am updating state from
getLanguage = () => {
    axios.get('http://localhost:3001/language')
        .then(function (response) {
            console.log(response.data.language);
            this.setState({
                language:response.data.language
            })
        })
        .catch(function (error) {
            return error;
    });
}

//I am calling function from
componentDidMount(){
    this.getLanguage();
    console.log("state after updating",this.state) //displays an empty array
}

---

但是，当我从jsx内部调用函数

getLanguage

时，它会更新状态。

使用es6 arrow函数更新您的函数

.then((response) => {
        console.log(response.data.language);
        this.setState({
            language:response.data.language
        })
    })

---

对于

es6

您可以使用

箭头功能

getLanguage = () => {
    axios.get('http://localhost:3001/language')
        .then((response) => {
            console.log(response.data.language);
            this.setState({
                language:response.data.language
            })
        })
        .catch((error) => {
            return error;
        })
    );
}

对于

es5

您可以声明

此

超出范围

axios

功能

function getLanguage() {
    var self = this;
    axios.get('http://localhost:3001/language')
        .then(function(response) {
            console.log(response.data.language);
            self.setState({
                language:response.data.language
            })
        })
        .catch(function(error) {
            return error;
        })
    );
}

---

当您更新

状态时，它不会立即更新。您可以使用
setState
callback查看状态何时更新。看到这一点：你用react-dev工具检查，而不是控制台，这里也是Ankyouworked@MUsmanNadeem这是没有道理的，如果这是问题所在，它在任何情况下都不应该更新（但他说它是通过jsx更新的）。它成功了。我添加了一个回调，它工作正常