Why when I call axios through a function is it not updated?

user_15783881 0
Viewed 208

In the app file I have a function called refreshList, when I update things in a database on the site I call it so that the state is updated and all the components are refreshed.

But I noticed something very strange when I called the function


 const refreshList = () => {

        userDetailsFunc (userDetails.code);
    };


    const userDetailsFunc = (cookiesName) => {
        if (cookiesName) {
            axios.get (`api / UserDetails? code = $ {cookiesName}`)
                .then ((user) => {
                    setUserDetails (user.data);
 }

It does not refresh the list and stays with the old details, but if I click again it will get the previous details, not what I updated.

I wanted to check it out and wrote

                   console.log (user.data);

And I saw that this is the content he gets in axios

But if I do refresh it gets the good content, why only if I refresh the page it works well, but when I call it through the function it does not change.

Anyone have any idea where I'm wrong?

axios reactjs
2 Answers

This is a very common behavior you face if you don't understand async/await promise topic.

Try this code:

 const refreshList = async () => {
    await userDetailsFunc (userDetails.code);
 };


 const userDetailsFunc = async (cookiesName) => {
    if (cookiesName) {
       const user = await axios.get (`api / UserDetails? code = ${cookiesName}`)
          
       setUserDetails(user.data);
    }
 }
user_113097270

I corrected the mistake. Before that I wrote the code that edits the user in one line And in a row after that I wrote the refreshList

Then it came to refreshList before it was updated in a database.

axios.post('api/EditDetails', obj)

        refreshList();

And when I changed the code to

axios.post ('api / EditDetails', obj) .then (() => {
             refreshList ();
         });

it worked out

user_157838810
Related