How to load response data using axios in react?
my componentdidmount:
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});
}
})
i want to create map response.data
Few things you need to take care of
First: bind the axios callback method, so that this inside it refers to the React component context
Second: Save the response in state rather than the component map
Third: Map over the state in render
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>
)
}
this.state.dataSelection.map instead of this.state.dataSelection.data.map