Странный результат от переданной функции дочернему компоненту [duplicate]
Вместо использования window.location = url; для перенаправления
попробуйте:
window.location.replace(url);
после использования replace () текущая страница не будет сохранена в истории сеансов, это означает, что пользователь не сможет использовать кнопку «Назад» для перехода к ней.
3 ответа
onClick необходимо передать функцию.
Ваш первый пример передает onClick функцию, которая вызывает this.props.onClick(this.state.id), когда она работает и работает должным образом.
Ваш второй пример передает onClick результат оценки this.props.onClick(this.state.id) , поэтому все идентификаторы печатаются сразу после загрузки компонента. Я предполагаю, что при вызове this.props.onClick(this.state.id) ничего не возвращается, поэтому onClick нечего вызывать, когда нажимают div.
onClick в <div> ожидает функцию, которую вы даете в # 1 (так называемая функция стрелки).
На # 2 вы даете результат выполнения this.props.onClick(this.state.id), который является недействительным.
Вы должны вызывать onClick как
onClick={this.props.onClick(this.state.id)}
. Поэтому измените на
onClick={() => this.props.onClick(this.state.id)}
. Это предотвратит автоматический вызов функции обработчика событий. С учетом вышеуказанного изменения функция обработчика события onClick вызывается только при нажатии
.