Inside submitButton event, I would like to check if there are any users registered or not.

Suppose there are 5 users registered:

 getUsers = function () {
    return new Promise(function (resolve, reject) {
      resolve(5);
      reject(0);
    });
  }

Inside the checkregisteredUsers, I call getUsers and then I check if there are any users. If there are any users, then return true, otherwise false. I set state of UsersFound.

  checkRegisteredUsers = () => {
    return this.getUsers().then(result => {
      return this.setState({ UsersFound: result > 0 ? true : false };
    }).catch(reason => {
      console.log(reason);
    });
  }

Now, inside the function submitButton, I would like to check for true or false, if there were users registered.

submitButton = () => {
      this.checkRegisteredUsers().then(result => {
      this.setState({ UsersFound: result > 0 ? true : false });
    });

    if(!this.state.UsersFound){
    return; **//exit code here and the rest of the code below should not execute and show the dialog box**
    }
    // run some other code
  }

When I call submitButton, the state of UsersFound is not set yet. If I click a second time then it is set. How can I set it inside a promise? Or How can I check for true/false inside the submitButton using promises?

EDIT:

The question is: how can I return a boolean from a promise as I would like to check something like this:

submitButton = () => {
 if(this.checkRegisteredUsers()){
  return; //the rest of the code below should not execute
}
 //if check users is true then the code below should not execute
 // some other code
}

I don't want a promise returned, I want a boolean.

Inside submitButton event, I would like to check if there are any users registered or not.

Suppose there are 5 users registered:

 getUsers = function () {
    return new Promise(function (resolve, reject) {
      resolve(5);
      reject(0);
    });
  }

Inside the checkregisteredUsers, I call getUsers and then I check if there are any users. If there are any users, then return true, otherwise false. I set state of UsersFound.

  checkRegisteredUsers = () => {
    return this.getUsers().then(result => {
      return this.setState({ UsersFound: result > 0 ? true : false };
    }).catch(reason => {
      console.log(reason);
    });
  }

Now, inside the function submitButton, I would like to check for true or false, if there were users registered.

submitButton = () => {
      this.checkRegisteredUsers().then(result => {
      this.setState({ UsersFound: result > 0 ? true : false });
    });

    if(!this.state.UsersFound){
    return; **//exit code here and the rest of the code below should not execute and show the dialog box**
    }
    // run some other code
  }

When I call submitButton, the state of UsersFound is not set yet. If I click a second time then it is set. How can I set it inside a promise? Or How can I check for true/false inside the submitButton using promises?

EDIT:

The question is: how can I return a boolean from a promise as I would like to check something like this:

submitButton = () => {
 if(this.checkRegisteredUsers()){
  return; //the rest of the code below should not execute
}
 //if check users is true then the code below should not execute
 // some other code
}

I don't want a promise returned, I want a boolean.

• javascript
• reactjs
• promise

Share Improve this question Follow edited May 10, 2020 at 6:55 Burre Ifort asked May 9, 2020 at 21:05 Burre IfortBurre Ifort 71344 gold badges1616 silver badges3232 bronze badges 4

• Put the logic inside then – Aluan Haddad Commented May 9, 2020 at 21:08
• remove the then and catch callback from the checkRegisteredUsers method. I remend using asyn/await statements to handle async functions as well. – Mahdi Tohidloo Commented May 9, 2020 at 21:10
• are you suggesting like this: checkRegisteredUsers = () => { return this.getUsers(); } I still can't set the state of userChecks. it still returns false the first time I click on the button – Burre Ifort Commented May 9, 2020 at 21:24
• Does this answer your question? How do I return the response from an asynchronous call? – Roamer-1888 Commented May 10, 2020 at 14:28

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 2

Long story short: You cannot make a function that returns a promise return a boolean. If you have some asynchronous action (like a fetch to get users from some service), that is inherently asynchronous. You cannot have such a function return a boolean, because by the time the function itself ends, you don't have the information to return true or false.

The closest you can get to that is using async/await. But async functions still only return Promise objects. You can make it look different using async/await, but it is just syntactic sugar. You are still effectively running all of the code after the await as though it were a function passed to then.

As an example, this:

//Some function that will resolve or reject.
const getUsers = () {
  return new Promise(function (resolve, reject) {
    resolve(5);
  });
}
const foundUsers = async () => {
  const users = await getUsers();
  return Boolean(users);
}
const LoggedIn = () => {
  const [usersFound, setUsersFound] = useState(false)
  const onSubmit = async () => {
    const found = await foundUsers();
    if (found) {
      //do stuff
    }
    setUsersFound(found)
  }
  return (
    <>
      <button onClick={onSubmit}>Submit</button>
      { usersFound ? <Dialog /> : <WhateverElse /> }
    </>
  )
}

Is the same as this:

const LoggedIn = () => {
  const [usersFound, setUsersFound] = useState(false)
  const onSubmit = () => {
    foundUsers().then((found) => {
      if (found) {
        //do stuff
      }
      setUsersFound(found)
    })
  }
  return (
    <>
      <button onClick={onSubmit}>Submit</button>
      { usersFound ? <Dialog /> : <WhateverElse /> }
    </>
  )
}