Функция onClick = {OnButtomSubmit} не работает в ReactJs

Я пытаюсь использовать 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 при использовании этой опоры.

Надеюсь, это поможет


Есть идеи?

10000