从另一个 function javascript 调用异步 function 时变得未定义

Question

For this project I am using wretch, which is a wrapper around fetch

This is a breakout of my code:

I have the wretch calls on a seperate service file to separate the render functionality from the wretch functionality.

I am exporting

export const wretchFunc = var => {
  return wretch(url)
    .json({
      var,
    })
    .get()
    .json()
};

The problem is with the second file: The function2 renders the result of the wretch function, I do resolve the promise and I get the result that I want but when I call it from function1 the return value is undefined even-though placing a console.log inside function2 gives me the boolean that I am looking for.

I have a function1 that returns:

return (function2 || function3)

and the function2 renders the result of wretchFunc and something like this:

function function2(state) {
  const var = fun(state);
  if (!var) {
    return false;
  }
  wretchFunc(var).then(json => {
    return JSON.parse(json).isTrue;
  });
}

My assumption is that function one gets executed before receiving the result of the function2 but I am not sure what to do.

Edit: I tried doing:

 return wretchFunc(var).then(json => {
    return JSON.parse(json).isTrue;
  });
}

Which gives me another promise that I can resolve on the upper function, but since I have a previous condition if(.var) that returns false that would make the function return 2 different things. is there a way that I can cast the value of the promise in function2 and force function1 to wait for its result.

Thanks

Answer 1

Try wrapping into new Promise and returning it

function function2(state) {
  return new Promise((res, rej) => {
    const var = fun(state);
    if (!var)
      res(false);
    wretchFunc(var)
    .then(json => resolve(JSON.parse(json).isTrue)
    .catch(err) => rej(err));
  })
}