import React, { Component } from "react";
class MyPics extends Component {
state = {
Show: false
};
handleClick = () => {
this.setState ({ Show: !this.state.Show });
};
render() {
const IMGS1 = [
{_id: 0, src: "../../../IMG/1.jpg", alt: "IMG0"},
{_id: 1, src: "../../../IMG/2.jpg", alt: "IMG1"},
{_id: 2, src: "../../../IMG/3.jpg", alt: "IMG2"}
];
return (
{
IMGS1.map(({ _id, src, alt }) => (
<img key={_id} src={src} alt={alt} style={IMGStyle} onClick={(this.handleClick = _id => console.log(_id))} />
))
}
);
}
}
export default MyPics;
将您的类方法修改handleClick为柯里化函数，以避免在 JSX 中立即调用该函数并导致应用程序崩溃：
handleClick = () => (id) => {
// id is accesible
};
onClick={this.handleClick(_id)}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句