В React есть два основных способа передать аргументы обработчикам событий: стрелочные функции и метод bind. Оба подхода часто используются при работе со списками или итерациями, когда нужно передать дополнительные параметры.
Подход со стрелочными функциями заключается в том, что ты оборачиваешь обработчик во встроенную функцию:
<button onClick={(e) => this.updateUser(userId, e)}>
Update User details
</button>
С этим методом ты обязательно должен передать объект синтетического события e как параметр, если тебе нужен доступ к нему.
Метод bind привязывает аргументы к обработчику в момент определения:
<button onClick={this.updateUser.bind(this, userId)}>
Update User details
</button>
При использовании bind объект синтетического события e автоматически передаётся как последний аргумент, поэтому тебе не нужно указывать его явно.
thisСтрелочные функции обычно предпочитают в современной разработке на React, потому что они более читаемые и не требуют понимания поведения bind в JavaScript. Однако подход с bind может быть немного производительнее, так как не создаёт новую функцию при каждом рендере (хотя на практике это редко имеет значение).
Выбирай в зависимости от предпочтений твоей команды и принятых соглашений по стилю кода.
Когда ты используешь стрелочные функции для передачи параметров в обработчики событий, объект синтетического события должен быть явно передан как параметр, если тебе нужен доступ к нему.
Новый — ещё не проверен сообществом
Вы