JavaScript for WordPress Forums Gutenberg Development Toggle Control conditional Reply To: Toggle Control conditional

#139259
chrisdavies71
Participant

Hi Zac,

I was not getting any error it was just not rendering the image.

Just starting out really with Gutenberg/JSX but I found this link 7-ways-to-implement-conditional-rendering-in-react-applications and used the Ternary Operators solution.

Code now looks like this and works

) : (

                  <Fragment>
                  <p class="image-wrapper">
                    <img
                      src={ imgURL }
                      alt={ imgAlt }
                    />
                  </p>

                  { carouselControls ?

                    <Fragment>
                    <a className="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
                      <span className="carousel-control-prev-icon" aria-hidden="true"></span>
                      <span className="sr-only">Previous</span>
                    </a>
                    <a className="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
                      <span className="carousel-control-next-icon" aria-hidden="true"></span>
                      <span className="sr-only">Next</span>
                    </a>
                    </Fragment>

                  : ''
                  }

                  </Fragment>

              ) //end if has image

It could probably be tidied up in places. Thanks for the help though.

Chris