Почему событие onBlur в react-contenteditable срабатывает всегда, когда в метод передаётся аргумент?

Question

[sinneren]

Использую react-contenteditable.
У него есть пропс onBlur в который я прописал метод handleChange. Если я передаю метод без аргумента onBlur={this.handleChange}, то всё ок, но стоит мне изменить на onBlur={this.handleChange('title')} то есть любой статичный аргумент, как событие onBlur начинает выполняться при загрузке, при каждом клике практически на любое место, в общем навешивается на каждый элемент.

Answer 1

[0xD34F]

передаю метод без аргумента onBlur={this.handleChange}

стоит мне изменить на onBlur={this.handleChange('title')}

Т-а-а-а-к, ясно. Осознаёте ли вы, что в первом случае вы назначаете в качестве обработчика onBlur метод handleChange, а во втором - результат его выполнения? Вы вообще понимаете, что функция и вызов функции - не одно и то же?

Хотите передавать параметр, делайте так: onBlur={() => this.handleChange('title')}. Или вместо передачи значения в качестве параметра добавляйте его элементу как атрибут, а в обработчике события считывайте:

onBlur={this.handleChange} data-change-param="title"

handleChange = (e) => {
  const changeParam = e.target.getAttribute('data-change-param');
  ...

Comments

[sinneren]

Спасибо, даже удалять не буду вопрос, собственная доска позора)