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选项卡

回答

相关问题