陣營+火力地堡：類型錯誤：無法讀取空

Question

我想從火力傳遞returend參數的狀態PARAM，但我發現這個錯誤的特性「的setState」：

App.js:43 Uncaught TypeError: Cannot read property 'setState' of null 

我想將「快照」數組傳遞到「日曆」，然後檢索日曆值，如「calendars.summary」或「calendars.date」（我知道如何做，但問題是我無法將快照分配給日曆）。

componentDidMount() { 
    //setInterval(() => start(this.state.gapi,true), 30000); 
    var rootRef = firebase.database().ref(); 
    var urlRef = rootRef.child("testCalendar/calendars"); 
urlRef.once("value", function(snapshot) { 
    snapshot.forEach(function(child) { 
    console.log(child.key+": "+child.child("summary").val()); 


    }); 
    this.setState({ 
     calendars: snapshot 
    }); 
}); 
    } 

我該如何解決？由於

UPDATE Mayank Shukla'comment後，我能夠做正確傳遞 「快照」：

componentDidMount() { 
    //setInterval(() => start(this.state.gapi,true), 30000); 
    var rootRef = firebase.database().ref(); 
    var urlRef = rootRef.child("testCalendar/calendars"); 
urlRef.once("value", function(snapshot) { 
    snapshot.forEach(function(child) { 
    console.log(child.key+": "+child.child("summary").val()); 

    }); 
    this.setState({ 
     calendars: snapshot 
    }); 
}.bind(this)); 
    } 

或

componentDidMount() { 
    //setInterval(() => start(this.state.gapi,true), 30000); 
    var rootRef = firebase.database().ref(); 
    var urlRef = rootRef.child("testCalendar/calendars"); 
urlRef.once("value", (snapshot) => { 
    snapshot.forEach(function(child) { 
    console.log(child.key+": "+child.child("summary").val()); 

    }); 
    this.setState({ 
     calendars: snapshot 
    }); 
}); 
    } 

但現在我有這樣的問題：

​​

關於此功能：

_getCalendarsList(){ 
    var d = new Date(); 

    return this.state.calendars.map((calend) => { 
    return (
     <Calendar 
     {...calend} 
     key={d.getTime()} /> 

    ) 
    }); 
    } 

Answer 1

要在任何變量使用map，該變量需要有一個array，你是取在componentDidMount方法的數據，將最初的渲染之後被調用，所以在狀態確認的初始值calendars應該[]，像這樣：

constructor(){ 
    super(); 
    this.state = { 
     calendars: [], 
     .... 
    } 
} 

或將支票使用map之前，如果這不是一個array然後return null，像這樣：

_getCalendarsList(){ 
    if(!Array.isArray(this.state.calendars)) 
     return null; 

    var d = new Date(); 

    return this.state.calendars.map((calend) => { 
     return (
      <Calendar 
        {...calend} 
        key={d.getTime()} 
      /> 

     ) 
    }); 
}