Я пытаюсь использовать onClick для моей кнопки в React, которая изначально должна просто печатать нажатой в консоли, но не работает.
Компонент, где он вызывается:
import React from 'react'
import 'tachyons'
const ImageLinkForm=({OnInputChange,OnButtomSubmit}) =>{
return (
<div>
<div className="center mt5 form br3 shadow-5 w-50">
<input className="f3 pa2 w-70 center" type="Text" onChange={OnInputChange}></input>
<button className="w-30 f4 grow link ph3 pv2 dib white bg-black pointer ma1" onClick={OnButtomSubmit}>Detect</button>
</div>
</div>
)
}
export default ImageLinkForm
Компонент используется в App.js следующим образом:
<ImageLinkForm OnInputChange={this.OnInputChange} OnButtonSubmit={this.OnButtonSubmit} ></ImageLinkForm>
Определения функций:
OnInputChange=(event)=>{
console.log(event.target.value);
}
OnButtonSubmit=()=>{
console.log('clicked');
}
Я не могу понять, что мне здесь не хватает. PS: onInputChange работает нормально
Всего 3 ответа
Это просто опечатка:
OnButtomSubmit // change m to n
OnButtonSubmit=()=>{
console.log('clicked');
}
есть опечатка, когда вы приносите его из реквизита
const ImageLinkForm=({OnInputChange,OnButtomSubmit}) =>{ // you typed OnButtom with an m instead of an n
Я думаю, что это опечатка в
<ImageLinkForm OnInputChange={this.OnInputChange} OnButtonSubmit={this.OnButtonSubmit} ></ImageLinkForm>
Поскольку вы используете OnButtomSubmit
качестве опоры в файле компонента, и вы используете OnButtonSubmit
при использовании этой опоры.
Надеюсь, это поможет