Question

138

image onClick failing in React

rated 0 times [ 139] [ 1] / answers: 1 / hits: 75951 / 7 Years ago, fri, december 15, 2017, 12:00:00

I have a React component which renders an image. That image has to capture the onClick event, but it doesn't. There is no reason for this behavior. Here is the code:

class MyComponent extends React.Component {



   imageClick = () => {

      console.log('Click!!!!');

   }       



   render () {

      return (

         <div>

            <img src='/myfolder/myimage.png' onClick={this.imageClick} />

         </div>

      );

   }

}

I can't see why it doesn't shows me back the 'Click!!!!' message in the browsers console when click on the image. It gives me back no error, no warning, no nothing. I'm using Chrome 62.0.3202 running on Linux Mint.

When isolated this code it works, but within boilerplate it does not, which is my case.

What am I missing here?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

freddiejarretk

Add To Favorites

Follow

Total Points: 612

Total Questions: 103

Total Answers: 88

Location: Armenia

Member since Sat, Dec 31, 2022

1 Year ago

answered 7 Years ago havenbilliec · Accepted Answer

class MyComponent extends React.Component {      

  

     render () {

        const imageClick = () => {

          console.log('Click');

        } 

        return (

           <div>

              <img src={require('/myfolder/myimage.png')} onClick={() => imageClick()} />

           </div>

        );

     }

  }