1

I am creating a react/ redux app with json fake api server I am trying to add a login and trying to get data from json fake api server, data is showing and all ok , but data is always resulting as a promise and the required data is inside the promise. i tried many ways to distructure but throwing errors , could anyone help me on this,

my axios request


const urlss = "http://localhost:5000/users";

    export const userslist = async () => {
      const r = await axios.get(urlss);
      const data = r.data;
    
      return data;
    };
    const newout2 = userslist();
    const newout = newout2;
    console.log(newout);

the place where I am using it


   export const login = (credentials) => (dispatch) => {
  return new Promise((resolve, reject) => {
    const matchingUser =
      newout2 &&
      newout2.find(({ username }) => username === credentials.username);
    if (matchingUser) {
      if (matchingUser.password === credentials.password) {
        dispatch(setUser(matchingUser));
        resolve(matchingUser);
      } else {
        dispatch(setUser(null));
        reject("Password wrong");
      }
    } else {
      dispatch(setUser(null));
      reject("No user matching");
    }
  });
};

i am getting this error

enter image description here

famo
  • 160
  • 1
  • 13
  • 1
    your `userslist` function looks fine. You're not seeing an error in the console, just the promise that your method returns - because it has to return a Promise. You can consume that promise in the same way you are doing inside it, with async/await - or alternatively using `.then`. See [this](https://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-asynchronous-call) question and answers for much on this topic. – Robin Zigmond Dec 26 '21 at 10:22

1 Answers1

1

You are using then in your userslist method while awaiting in an async method. drop the then and just use proper await inside an async method.

const urlss = "http://localhost:5000/users";
export const userslist = async () => {
  const r = await axios.get(urlss);
  const data = r.data;

  return data;
};
Ran Turner
  • 14,906
  • 5
  • 47
  • 53
  • #Ran Turner Updated to that code still getting same promise if possible could give some idea to destructure data from promise ? output in console is still same like error screenshot – famo Dec 26 '21 at 10:14