Question

我尝试使用fetch从api获取数据。控制台日志给了我正确的json，但是在尝试设置状态时我收到以下错误：

TypeError：无法读取属性＆＃39; setState＆＃39;未定义的（...）

getInitialState() {
    return {
      checklist: {},
      documents: [],
      questions: [],
      faqs: [],
      hospitals: [],
      profile: {},
      guarantor: {},
    }
},

componentDidMount(){
    this.fetchUser(1);
    this.fetchFaqs();
},

fetchFaqs() {
    fetch(FAQ_API) 
        .then(function(response){
            return response.json();
        })
        .then(function(json){
            console.log("faqs: " , json);

            this.setState({
                faqs: json,
            });

        })
        .catch((error) => {
            console.warn(error);
        });

},

Answer 1

看起来对'this'的引用不再指向正确的位置，尝试这样做：

fetchFaqs() {
var self = this;
    fetch(FAQ_API) 
        .then(function(response){
            return response.json();
        })
        .then(function(json){
            console.log("faqs: " , json);
            self.setState({
                faqs: json,
            });
        })
        .catch((error) => {
            console.warn(error);
        });
}

如果你不想创建自变量，你也可以将你的promise返回函数重构为es6 fat arrow函数，这会将它放在正确的范围内：

fetchFaqs() {
    fetch(FAQ_API) 
        .then((response) => {
            return response.json();
        })
        .then((json) => {
            this.setState({
                faqs: json,
            });
        })
        .catch((error) => {
            console.warn(error);
        });
}

设置状态时导致此TypeError的原因是什么？

1 个答案: