Sean Kim
Sean Kim

Reputation: 169

React API Reference

enter image description here

The "list" is API_Call from the "Axios.get".

I want to check the API "src" Empty or not.

How can I check for this.

Upvotes: 2

Views: 84

Answers (4)

Sean Kim
Sean Kim

Reputation: 169

<Card key={result.id}
  hoverable
  style={{ width:240 }}
  cover={ () => {

    const cardImage = result.volumeInfo.imageLinks.thumbnail

    // If result.volumeInfo.imageLinks.thumbnail is defined, render
    // image with it, otherwise rendering some other fallback image
    return (cardImage ? 
      <img alt="example" src={ cardImage } /> :
      <img alt="example" src="/some-empty-image.jpg" />)
  }} >    

  <Meta title={result.volumeInfo.title} />
</Card>

Upvotes: 0

kiranvj
kiranvj

Reputation: 34147

This should work

src={result.volumeInfo.title == "" ? "empty-src" : result.volumeInfo.title }

Upvotes: 0

Dacre Denny
Dacre Denny

Reputation: 30400

Perhaps you could use conditional logic like this, to render either the image for result.volumeInfo.imageLinks.thumbnail, or some other fallback image if result.volumeInfo.imageLinks.thumbnail is undefined?

So, somthing like the following:

<Card key={result.id}
  hoverable
  style={{ width:240 }}
  cover={ () => {

    const cardImage = result.volumeInfo.imageLinks.thumbnail

    // If result.volumeInfo.imageLinks.thumbnail is defined, render
    // image with it, otherwise rendering some other fallback image
    return (cardImage ? 
      <img alt="example" src={ cardImage } /> :
      <img alt="example" src="/some-empty-image.jpg" />)
  }} >    

  <Meta title={result.volumeInfo.title} />
</Card>

Upvotes: 1

Asif vora
Asif vora

Reputation: 3347

Call a get API using axios and check response.
// Make a request for a list
 axios.get('URL path')
  .then(function (response) {
    console.log(response);
    //put ur condition code here if exits or not whatever u want
  })
  .catch(function (error) {
    console.log(error);
  });

Upvotes: 0

Related Questions