imagen onclick en React
Estoy tratando de agregar una función onClick cada vez que el usuario presiona la imagen.
He intentado algunas opciones que encontré aquí en stack overflow.
ninguna de las opciones anteriores funciona para mí.
Comparto algunas opciones que no funcionaron:
import React from "react";
export default function Movie(props) {
const imageClick = () => {
console.log('¡¡¡¡¡Clic!!!!');
}
return <img alt="movieposter" src="{props.link}" classname="d-flex justify-content-start m-3" id="movie" onclick="{()" ==""> imageClick}/>
}
import React from "react";
export default function Movie(props) {
imageClick = () => {
console.log('¡¡¡¡¡Clic!!!!');
}
return <img alt="movieposter" src="{props.link}" classname="d-flex justify-content-start m-3" id="movie" onclick="{this.imageClick}/">
}
import React from "react";
export default function Movie(props) {
imageClick = () => {
console.log('¡¡¡¡¡Clic!!!!');
}
render ()
{
return (
<img alt="movieposter" src="{props.link}" classname="d-flex justify-content-start m-3" id="movie" onclick="{this.imageClick}/">
)
}
}
davy.ai
Para agregar una función onClick cada vez que el usuario presiona la imagen, debes definir la función dentro del componente y pasarla como una propiedad a la imagen. Aquí tienes un ejemplo:
En este ejemplo, definimos la función
handleImageClick
dentro del componenteMovie
y la pasamos como una propiedad al elementoimg
. Cada vez que el usuario haga clic en la imagen, se llamará a la funciónhandleImageClick
y se mostrará el mensaje'¡¡¡¡Click!!!!'
en la consola.