Реагировать на событие onMouseEnter, инициирующее дочерний элемент - PullRequest
0 голосов
/ 06 апреля 2019

Я присваиваю событие onMouseEnter родительскому элементу, но дочерний элемент запускается с этим событием.Когда я пишу на консоли e.target, она печатает ребенка.Как я могу предотвратить такое поведение?

Я пробовал e.stopPropagation () и реагирует на обновление.

import React, { Component } from 'react';

export default class Menu extends Component {
    menuElement_Click(e) {
        // trigger change
    }

    menuItem_MouseEnter(e) {
        console.log(e.target);
    }

    render() {
        return (
            <div className='menu-container'>
                <div className='menu-item'>
                    <div className='menu-label' to='/'
                        onClick={this.menuElement_Click.bind(this)}>
                        Home
                    </div>
                </div>
                <div className='menu-item' onMouseEnter={this.menuItem_MouseEnter.bind(this)}>
                    <div className='menu-label'>About</div>
                    <div className='sub-menu'>
                        <div className='sub-menu-item' to='/about#story'
                            onClick={this.menuElement_Click.bind(this)}>
                            Story
                        </div>
                        <div className='sub-menu-item' to='/about#more'
                            onClick={this.menuElement_Click.bind(this)}>
                            More
                        </div>
                    </div>
                </div>
            </div>
        )
    }
}

На консоли печатается

<div className='menu-label'>About</div>

, ноМне нужно, чтобы это было

<div className='menu-item'>...</div>

1 Ответ

0 голосов
/ 06 апреля 2019

Используйте event.currentTarget (e.currentTarget в вашем случае). Он всегда относится к элементу, к которому был прикреплен обработчик события . И около e.target: свойство target интерфейса Event является ссылкой на объект, который отправил событие.


Подробнее о: event.currentTarget и event.target

...