Как привязать event к каждому элементу в списке?

Question

[Hellas]

Например:

<ul>
  <li name="one">1</li>
  <li name="two">2</li>
  <li name="three">3</li>
  <li name="four">4</li>
  <li name="five">5</li>
  <li name="six">6</li>
</ul>

Каждому элементу li необходимо прописать -

onMouseOver={() => this.hover(event.target.getAttribute('name'))}
  onMouseOut={() => this.hover(false)}

Элементов очень много, есть ли возможность указать эти евенты без прописывания их каждому элементу?

Answer 1

[Николай]

делегированием только если.

Answer 2

[PAJCH]

Ничего страшного. Только визуально кажется что мы вешаем на каждый элемент событие. На самом деле React куда умнее. Он сам их делегирует.

Comments

[Negwereth]

пруф дайте, если не тяжело, интересно почитать

Answer 3

[Павел Корнилов]

<ul onclick= "fn(event)">
  <li name="one">1</li>
  <li name="two">2</li>
  <li name="three">3</li>
  <li name="four">4</li>
  <li name="five">5</li>
  <li name="six">6</li>
</ul>
<script>
function fn (e) {
	alert(e.target.textContent);
	e.stopPropagation();
}
</script>