Getting data from mongoose on server but an empty array in React

Question

When I try to return a data from moongoose using React it just display an empty array using a useEffect and it return the data when I change something inside the page , also when I try to map the data, it shows nothing :

server side:

const mongoose = require('mongoose');

const Partner = new mongoose.Schema({
    name: { type: String },
    website: { type: String },
},
    { collection: 'partner-data' }
);

const partnerModal = mongoose.model('partner-data', Partner);

module.exports = partnerModal;


app.get('/getpar', (req, res) => {
    Partner.find().then(result => res.send(result)).catch(err => console.log(err))
})

client side :

const [par, setPar] = useState([]);

    useEffect(() => {
        
        async function getPartners() {
            const req = await axios.get("http://localhost:1200/getpar");
            setPar(req.data);
            console.log(par);
        }

        getPartners();
    },[])

{par.map(p => {p.name})}

The server side is working fine, it displays the data when I recall it but when I console log inside the client side it shows an empty array and it doesn't display any data.

Youssouf Oumar · Accepted Answer · 2022-06-25 07:48:15Z

1

You are "console logging" before React has updated the state. In fact updating a state is an asynchronous task. To be sure that you are getting the data, do this in getPartners:

console.log(req.data);

And outside your useEffect somewhere, do:

console.log(par);

edited Jun 25, 2022 at 7:48

answered Mar 5, 2022 at 15:36

Youssouf Oumar

47.5k16 gold badges109 silver badges108 bronze badges

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

1 Comment

Razor Jhon Over a year ago

oh i didn't know that , thank you its working

Collectives™ on Stack Overflow

Getting data from mongoose on server but an empty array in React

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related