Home > database >  Adding more than one conditional in an <img> src?
Adding more than one conditional in an <img> src?

Time:10-16

This is a line of code in my react app

<img className='ArrowIcon' src={data?.quote_data[0].change < 0 && arrowdown}></img>

I am trying to change the icon when the data is less than 0 and greater than 0 but dont know how to include both in the src of the img.

Is there any way to add in that when data?.quote_data[0].change > 0 it returns arrowup. When I use a comma it gives and error.

Thanks :)

CodePudding user response:

As in the title of your question - you need a conditional expression, so use the conditional operator.

<img
  className='ArrowIcon'
  src={
    data?.quote_data[0].change < 0 ? arrowdown
    : data?.quote_data[0].change > 0 ? arrowup
    : defaultvalue
  }
></img>

(where defaultvalue would be if neither condition is fulfilled)

  • Related