Я делал подобные вещи для названий штатов. Зависит от того, что вы хотите, вы можете попробовать это. Так что мне не нужно связывать функцию снова. Где вы можете получить название штата
вы должны использоватьthis
ключевое слово в обработчике события, вы должны связать функцию (обработчик события) сthis
kerword. В противном случае вам нужно использоватьфункция стрелки.
например
//This function isn't bound whilst using "this" keyword inside of it.
//Still, it works because it uses an arrow function
handleClick = () => {
this.setState({
isClicked:true
});
}
render() {
return (
<div className="App">
<button onClick={this.handleClick}>Click</button>
</div>
);
}
Однако, с подходом выше, вы не можете передать параметр. Вам нужно использовать либо ...
bind(this, param)
после функциифункция анонимной стрелкито есть
<button onClick={this.handleClick}>Click</button>
will be
<button onClick={this.handleClick.bind(this, 111)}>Click</button>
or
<button onClick={() => this.handleClick(111)}>Click</button>
Здесь вопрос.
Каков наиболее эффективный способ передачи параметра в обработчик событий?
Согласно софициальный документ, с помощьюbind()
может подорвать производительность, потому что ...
Использование Function.prototype.bind в render создает новую функцию каждый раз, когда компонент рендерит
То же самое касается использования функции анонимной стрелки. Док говорит, что ...
Использование функции со стрелкой в рендере создает новую функцию каждый раз, когда компонент рендерит
Тогда, что будет наиболее эффективным способом передачи параметра?
Любой вклад будет оценен.
PS
Некоторые люди спрашивают, какparam
определен. Это будет определяться динамически (т.е. не всегда111
). Таким образом, это могут быть состояния, реквизиты или некоторые другие функции, определенные в этом классе.