Как мне отметить, где я щелкнул изображение в моем проекте ReactJS? - PullRequest
Новая
       40

Как мне отметить, где я щелкнул изображение в моем проекте ReactJS?

0 голосов
/ 06 августа 2020

Я использую reactjs в своем проекте. Я хочу отметить, где я нажимаю на картинку. Но я не мог этого сделать. Есть пример в Codepen. Я могу получить координату картинки, но не могу ее отметить. Я просто хочу, чтобы точка была там, где я щелкнул. Если я щелкну по-другому, эта точка будет указывать на то место, где я щелкнул. Старая точка будет удалена.

Вот код 

class Application extends React.Component {
    constructor(props) {
        super(props);
        this.state = { x: 0, y: 0 };
    }
    _onMouseMove(e) {
        this.setState({ x: e.nativeEvent.offsetX, y: e.nativeEvent.offsetY });
    }
    render() {
        const { x, y } = this.state;
        return <div className="container">
            <div>
                <img onMouseMove={this._onMouseMove.bind(this)} width="100" height="150" 
                    src="http://www.mariogiannini.com/wp-content/uploads/2017/10/Photo-200x300.jpg" />
            </div>
        <h1>{ x } { y }</h1><br/>
    </div>;
    }
}

Пример кода

...