Ошибка типа: _this2.props.someFunciton не является функцией - реагировать

Question

Хотя есть сообщения с похожими заголовками, все они не имеют значения или не отвечают на вопрос, который был опубликован.

У меня есть компонент, который называется так на другой странице:

<SomeComponent  aParticularProp={(arg) => {this.someFunction(arg)}} />

Вот упрощенная версия того, как выглядит SomeComponent:

 class SomeComponent extends React.Component{

constructor(props){
    super(props);
    this.state = {someState: "test"};
}

something(){
  return (
      <SpecialButton 
          onClick={() => {this.props.someFunction(this.state.someState)}}
      />
  )

}

render () {
   return (
         {this.something()}
   ); 
}

}

Почему я получаю "Ошибка типа: _this2.props.someFunciton не является функцией"?

Answer 1

Если вы пытаетесь передать функцию из родительского в дочерний компонент и сохранить исходный контекст, стоит связать ее с этим компонентом одним из следующих способов:

<SomeComponent someFunction={this.someFunction.bind(this)} />

ИЛИ объявив вашу функцию следующим образом: someFunction = args => {}

Более подробно о том, почему this2.props.someFunction is not a function, передав вашу функцию, как так someFunction={(arg) => {this.someFunction(arg)}} вы на самом деле непередача функции дочернему компоненту, а скорее вызов функции и возврат результатов.

Answer 2

Вы передаете aParticularProp в качестве реквизита, а не SomeFunction ... Итак, в SomeComponent вы можете ссылаться на this.props.aParticularProp.

И this.someFunction в родительском компоненте должен быть определен в родительском компоненте.