Передача функции в качестве опоры функциональному компоненту

Question

Передача функции в качестве опоры функциональному компоненту

1

Попытка передать функцию в качестве опоры в функциональный компонент React и постоянно получать logThis is not a function ошибок. logThis is not a function

Родительский компонент является компонентом класса с функцией logToConsole. Я обобщил код ниже.

logToConsole = (value) => {
  console.log(value)
}
render(){
return(
<ChildComp logThis={this.logToConsole} />
)
}

ChildComp - это:

const ChildComp = (logThis) => (
  <button onClick={()=>logThis('test string')}>Click Here</button>
)

export default ChildComp

PanczerTank 26 апр. 2019, в 20:47

Источник

Теги:

javascript

reactjs

3 ответа

Ещё вопросы

Maheer Ali · Answer 1 · 2019-04-26T17-04-00.000Z

Первым параметром logThis будет сам объект-подпорка. Вам необходимо деструктурировать объект logThis.

const ChildComp = ({ logThis }) => (
  <button onClick={() => logThis('test string')}>Click Here</button>
)

Или вы можете получить к нему доступ из props

const ChildComp = (props) => (
  <button onClick={() => props.logThis('test string')}>Click Here</button>
)

Tahir Iqbal · Answer 2 · 2019-04-26T17-05-00.000Z

лог деструктура это из реквизита

const ChildComp = ({logThis}) => (
  <button onClick={()=>logThis('test string')}>Click Here</button>
)

export default ChildComp

user2343647 · Answer 3 · 2019-04-26T16-15-00.000Z

Изменить на:

const ChildComp = (props) => (
  <button onClick={()=>props.logThis('test string')}>Click Here</button>
)

export default ChildComp