javascript - 如何从地图中获取id

Question

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;

标签： javascriptreactjs

Answer 1

将您的类方法修改handleClick为柯里化函数，以避免在 JSX 中立即调用该函数并导致应用程序崩溃：

handleClick = () => (id) => {
   // id is accesible
};

onClick={this.handleClick(_id)}