React -render值onClick選項卡

我有一個應用程序，它使用axios並使用我放在選項卡上的地圖呈現值（例如：ID和warehouseName）。現在我想要做的是通過我在地圖中獲得的值ID在warehouseID的loadBrandTotal()處發佈狀態。React -render值onClick選項卡

到目前爲止，我的代碼是這樣的

export default React.createClass({ 
 

 
    getInitialState(){ 
 
     return { 
 
      warehouseName: "" 
 
     } 
 
    }, 
 

 
    componentWillMount(){ 
 
     this.loadWarehouse(); 
 
     this.loadBrandTotal(); 
 
    }, 
 

 

 
    loadWarehouse(){ 
 
     var that = this 
 
     var url = api + 'retrieveWarehouseList'; 
 
     axios.post(url, 
 
      { 
 
       warehouseName : 'NONE' 
 
      }) 
 
     .then(function (response) { 
 
      console.log(response.data); 
 
      that.setState({ 
 
       warehouseList : response.data.retrieveWarehouseListResult 
 
      }); 
 
      }) 
 
     .catch(function (response) { 
 
      console.log(response); 
 
     }); 
 
    }, 
 

 
    loadBrandTotal(){ 
 
     var that = this 
 
     var url = api + 'retrieveTotalSalesPerBrand'; 
 
     axios.post(url, 
 
      { 
 
       warehouseID : "None" 
 
      }) 
 
     .then(function (response) { 
 
      console.log(response.data); 
 
      that.setState({ 
 
       totsalesperbrand : response.data.retrieveTotalSalesPerBrandResult 
 
      }); 
 
      }) 
 
     .catch(function (response) { 
 
      console.log(response); 
 
     }); 
 
    }, 
 

 
    render() { 
 
    var wareName = this.state.warehouseList; 
 
    return (
 
    \t <ul className="tabs tabs-transparent"> 
 
\t   {wareName.map(function(nameoObjects) { 
 
\t   return (
 
\t    <li className="tab"> 
 
\t     <a href="#test1" value={nameoObjects.ID} key={nameoObjects.ID}>{nameoObjects.warehouseName}</a> 
 
\t    </li> 
 
\t   ) 
 
\t   })} 
 
\t  </ul> 
 
    \t)} 
 

 
})

非常感謝提前。

來源

2017-01-10 kcNeko

我不是100％確定你想做什麼，但是它是否在loadBrandTotal（）函數內部發布你在loadWarehouse（）函數中獲得的數據？如果是這樣，當你想要做這張貼時，當它被渲染？點擊一個按鈕？

下面是一個例子，其中每個列表元素有一個按鈕，發送ID值的元素在地圖溫控功能到了loadBrandTotal（）函數，其中它的發佈（參見更改代碼註釋）：

// Give the id as an argument to loadBrandTotal 
loadBrandTotal(id){ 
     var that = this 
     var url = api + 'retrieveTotalSalesPerBrand'; 
     axios.post(url, 
      { 
       // Post the ID 
       warehouseID : id 
      }) 
     .then(function (response) { 
      console.log(response.data); 
      that.setState({ 
       totsalesperbrand : response.data.retrieveTotalSalesPerBrandResult 
      }); 
      }) 
     .catch(function (response) { 
      console.log(response); 
     }); 
    }, 

    render() { 
    var wareName = this.state.warehouseList; 
    return (
     <ul className="tabs tabs-transparent"> 
      {wareName.map(function(nameoObjects) { 
       return (
       <li className="tab"> 
        <a href="#test1" value={nameoObjects.ID} key={nameoObjects.ID}>{nameoObjects.warehouseName}</a> 
        // When clicked, this button sends THIS list object's nameoObject ID to the loadBrandTotal function, where it's posted 
        <button onClick{() => this.loadBrandTotal(nameoObjects.ID)}>Post ID</button> 
       </li> 
      ) 
      })} 
     </ul> 
    )}

因此，在該示例中，map函數中呈現的每個列表元素都包含一個按鈕，該按鈕在單擊時將其自己的nameoObject ID發送到loadBrandTotal函數，並在其中發佈並設置狀態。這是你想要做的事嗎？

來源

2017-01-10 04:37:04 Jayce444

React -render值onClick選項卡

回答

相關問題