检查空对象并返回布尔值

Question

I have a AddContactForm form that allows the user to add contacts .

When the user fills in the conactNumber - onBlur it checks if this conactNumber already exists.

How can I make The CheckIfContactExists function returns either true or false instead of the promise object?

Please note that I can't change the returned value from the api, it only return a contact object.

export default class AddContactForm extends Component {
  state = {
   ...
  };

  checkContact = () => {
    const { contactNumber } = this.state.newContactInfo;
    CheckIfContactExists(contactNumber); //return promise
  };

 render() {
   ...
    return (  
       ...
   );
  }
}

const CheckIfContactExists = async searchString => {
  const { data: contactsInfo } = await axios.get(`api/Contacts/SearchContact?contactNum=${searchString}`);
};

Answer 1

Make use of async await in checkContact just like you did for CheckIfContactExists . Also return the boolean result from CheckIfContactExits method

export default class AddContactForm extends Component {
  state = {
   ...
  };

  checkContact = async () => {
    const { contactNumber } = this.state.newContactInfo;
    try {
      const res = await CheckIfContactExists(contactNumber); 
      return res;
    } catch (e) {
       console.log('Error', error);
    }
  };

 render() {
   ...
    return (  
       ...
   );
  }
}

const CheckIfContactExists = async searchString => {
  const { data: contactsInfo } = await axios.get(`api/Contacts/SearchContact?contactNum=${searchString}`);
  if (Object.keys(contactsInfo).length > 0) {
     return true;
  } else {
      return false;
  }
};

Answer 2

You can't make it return just a boolean since it's an asynchronous operation. You could make the checkContact function async as well and await it.

Example

export default class AddContactForm extends Component {
  state = {
   // ...
  };

  checkContact = async () => {
    const { contactNumber } = this.state.newContactInfo;
    const contactInfo = await CheckIfContactExists(contactNumber);

    this.setState({
      contactNumberTaken: Object.keys(contactInfo).length !== 0
    });
  };

  render() {
    // ...
  }
}