的setState不工作

Question

class Assets extends React.Component{ 

    constructor() { 
    super(); 
    this.state = { 
      assets: [], 
      secondsElapsed: 0 
     }; 
    } 

tick() { 
    if(start === true){ 

     fetch('/api/user/all/?name='+name, {credentials: 'include', method: 'get'}).then(function(data){ 
     return data.json(); 
     }).then(json => { 
     this.setState({ 
      assets: json 
      }); 
     }); 
     } 
    } 
    } 

ReactDOM.render(<Assets />, document.getElementById('alerts')); 

此代碼是引發此錯誤：

Uncaught (in promise) TypeError: Cannot read property 'setState' of null 
    at eval (eval at <anonymous> (bundleAlerts.js:3430), <anonymous>:265:15) 
    at <anonymous> 

的代碼被遵守的WebPack如果有差別。我之前使用過ReactCreate類，它工作的很好，但我改變了它，試圖修復另一個錯誤。

謝謝，編輯。

Answer 1

將您的tick函數綁定到您的組件。 :)它目前綁定到該函數，而不是綁定到類組件，因此它無法訪問'this'，這意味着它將無法訪問您的道具或狀態。你可以使用下面的例子，autobind裝飾器（ES7）或者轉換類屬性'tick =（）=> {...}'。

class Assets extends React.Component { 
 
    constructor() { 
 
    super(); 
 
    this.state = { 
 
     assets: [], 
 
     secondsElapsed: 0 
 
    }; 
 
    this.tick = this.tick.bind(this); 
 
    } 
 
    tick() { 
 
    if (start === true) { 
 
     fetch("/api/user/all/?name=" + name, { 
 
     credentials: "include", 
 
     method: "get" 
 
     }) 
 
     .then(data => { 
 
      return data.json(); 
 
     }) 
 
     .then(json => { 
 
      this.setState({ 
 
      assets: json 
 
      }); 
 
     }); 
 
    } 
 
    } 
 
    // ...rest of component 
 
} 
 

 
ReactDOM.render(<Assets />, document.getElementById("alerts"));