Как создать событие click в ul, li или div в реагировать

Question

Я пытаюсь отключить событие click в компоненте actjs, но оно не работает. Я попытался это безуспешно в div, ul, li и даже кнопка. У меня есть демо здесь

Я посмотрел на этот вопрос, но проблема не та, с которой я сталкиваюсь, как видно из демонстрации выше

Answer 1

onClick принимает функцию и будет записана как

<button onClick={() => {console.log("Hi")}}>Hello</button>

или же

handleClick() {
    console.log('Hi');
}
<button onClick={this.handleClick}>Hello</button>

вместо

<button onClick={console.log("Hi")}>Hello</button>

Если ты пишешь onClick={console.log("Hi")}, на каждой render значение для onClick оценивается и, следовательно, Hi видно на console

Answer 2

Вы должны предоставить функцию в обработчике событий, а не вызывать ее. Увидеть:

import React from "react";
import { render } from "react-dom";

const App = () => (
  <div>
    <div>
      <button onClick={() => {console.log("Hi")}}>Hello</button>
    </div>
  </div>
);

render(<App />, document.getElementById("root"));