How to Store All Axios Response Data in State Using the Map Method in React.js

Question

I need to store all the information from an Axios response in the state as JSON and use the map method to process the data.

The problem is that when I use the map method after the Axios request, it only adds the last JSON object to the state, even though there are 9 objects in my JSON.

How can I ensure all objects from the JSON response are stored in the state?

Here is my code:

const [expensesData , setExpensesData] = useState([])

useEffect(() => {
    axios.get('API-address')
    .then(res => {
        res.data.map( info => {
            setExpensesData(
                [
                    ...expensesData,
                    {info}
                ]
            )
        })
    })
    .catch(e => console.log(e))
} , [])

hellogoodnight · Accepted Answer · 2021-10-28 06:59:06Z

3

const [expensesData , setExpensesData] = useState([])

useEffect(() => {
    axios.get('API-address')
    .then(res => {
        setExpensesData(res.data);
    })
    .catch(e => console.log(e))
} , [])

answered Oct 28, 2021 at 6:59

hellogoodnight

2,1697 gold badges32 silver badges60 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

AJAY KACHHIYAPATEL · Accepted Answer · 2022-02-11 10:24:07Z

1

Last line will improve your application performance you application It will render method called when your expensesData

    const [expensesData , setExpensesData] = useState([])
    
    useEffect(() => {
        axios.get('API-address')
        .then(res => {
            setExpensesData(res.data);
        })
        .catch(e => console.log(e))
    },[expensesData])

answered Feb 11, 2022 at 10:24

AJAY KACHHIYAPATEL

1692 silver badges10 bronze badges

Collectives™ on Stack Overflow

How to Store All Axios Response Data in State Using the Map Method in React.js

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related