如何處理JavaScript中的反應

Question

我是新的反應，我試圖訪問一個API的數據，我做了兩個獲取數組值和一個處理程序打印一個console.log當你點擊一個表中的一行。當我點擊表格時，它向我顯示了客戶的id（這個id是我獲取客戶獲取的id），但是當我試圖用getHistory獲取另一個值時，它會打印出未定義的值。

這裏是取：

 getCustomers(){ 

     fetch(

      DOMAIN+'/api/customers/shop/'+this.props.salon, { 
       method: 'get', 
       dataType: 'json', 
       headers: { 
        'Accept': 'application/json', 
        'Content-Type': 'application/json', 
        'Authorization':'Bearer '+this.props.token 
       } 
      }) 
      .then((response) => 
      { 

       return response.json(); 
      }) 
      .then((responseData) => { 
       responseData.map(function (v) { 
        v.platform = v.app ? v.app.platform : null }) 
       this.setState({customers:responseData}); 
       //console.log(responseData); 

      }) 
      .catch(function() { 
       console.log("error"); 
      }); 
    } 


getHistory() { 
     fetch(
      DOMAIN+'/api/orders/',{ 
       method: 'get', 
       dataType: 'json', 
       headers: { 
        'Accept': 'application/json', 
        'Content-Type': 'application/json', 
        'Authorization':'Bearer '+this.props.token 
       } 
      }) 
      .then((response) => 
      { 

       return response.json(); 
      }) 
      .then((responseData) => { 
       responseData.map(function (v) { 
        v.platform = v.app ? v.app.platform : null }) 
       this.setState({orders:responseData}); 
       console.log(responseData); 

      }) 
      .catch(function() { 
       console.log("error"); 
      }); 

    } 

這裏是處理：

handleCellClick(y,x,row){ 
      //this.getHistory(this.state.orders); 

      var ab= this.state.orders 
      this.setState({ 
       open:true, 
       slideIndex: 0, 
       newForm:false, 
       customer:{...row,_id:row._id}, 
       order:{...x,customer:x.customer} 

      }); 
      this.getCustomers(row._id); 
      this.getHistory(x.customer); 
      console.log(row._id); 
      console.log(x.customer); 

     } 

我得到的row._id但客戶價值返回我不確定，

感謝您的幫助！

Answer 1

您需要在getHistory方法中返回承諾，然後使用then子句將調用鏈接到此方法。

getHistory() { 
     return fetch(
      DOMAIN+'/api/orders/',{ 
       method: 'get', 
       dataType: 'json', 
       headers: { 
        'Accept': 'application/json', 
        'Content-Type': 'application/json', 
        'Authorization':'Bearer '+this.props.token 
       } 
      }) 
      .then((response) => 
      { 

       return response.json(); 
      }) 
      .then((responseData) => { 
       responseData.map(function (v) { 
        v.platform = v.app ? v.app.platform : null }) 
       this.setState({orders:responseData}); 
       console.log(responseData); 

      }) 
      .catch(function() { 
       console.log("error"); 
      }); 

    } 

然後調用它像這樣在電池點擊處理函數

handleCellClick(y,x,row){ 
     //this.getHistory(this.state.orders); 

     var ab= this.state.orders 
     this.setState({ 
      open:true, 
      slideIndex: 0, 
      newForm:false, 
      customer:{...row,_id:row._id}, 
      order:{...x,customer:x.customer} 

     }); 
     this.getCustomers(row._id); 

     this.getHistory(x.customer).then(response => console.log(response)) 
     console.log(row._id); 
     console.log(x.customer); 

    }