如何在反应中使用axios加载响应数据？

Question

如何在react中使用axios加载响应数据？

我的组件没有挂载：

var params = new URLSearchParams();
params.append('id', this.state.ids);

axios.post('http://127.0.0.1:8000/items/select/', params)
  .then(function(response, data){

    x => {

    let push = response.data.map((idb, index)=>{
        return(

          <SingleProduct takeid={idb} />    

            )
        })
    this.setState({dataSelection: push});
    }
  })

我想创建地图response.data

Answer 1

您需要注意的几件事

首先： bind axios callback方法，这样里面的this就是指React组件上下文

其次：将响应保存在状态而不是组件映射中

第三：渲染状态映射

state = {
    dataSelection: []
}
componentDidMount() {
  var params = new URLSearchParams();
  params.append('id', this.state.ids);

  axios.post('http://127.0.0.1:8000/items/select/', params)
    .then((response, data) => {
        this.setState({dataSelection: response.data});
      }
    })
}

render () {
   return (
      <div>
        {this.state.dataSelection.map((idb, index)=>{
          return(
               <SingleProduct takeid={idb} />    
            )
          })
        }
      </div>
   )
}

如何在反应中使用axios加载响应数据？

How to load response data using axios in react?

reactjs

axios