2016-06-12 4 views
2

나는 반갑습니다. 나와 함께하시기 바랍니다. 이미 어딘가에 답변이 있다면 기쁘게 생각합니다. 내가 App을 통과하는 방법 '콜백 함수를 React 구성 요소에 전달하는 것이 가장 간단한 방법입니까?

const App = React.createClass({ 
    render() { 
     return (
      <div> 
       <h1>Hallo Welt</h1> 
       <Button onButtonClick={this.handleButtonClick}/> 
      </div> 
     ) 
    }, 

    handleButtonClick() { 
     console.log('Button clicked') 
    }, 
}) 

참조 :

const Button = React.createClass({ 
    render() { 
     return(
      <button type="button" onClick={this.onClick}>Hallo Button</button> 
     ) 
    }, 

    onClick() { 
     this.props.onButtonClick() 
    }, 
}) 

이 버튼 구성 요소가 나는 App 전화를 다른 구성 요소가 소유하고 있습니다 :

내가 간단한 버튼 구성 요소를 구축 시작, 젖은 내 발을 얻으려면 단추 구성 요소에 대한 보조 도구로 handleButtonClick() 메서드. official React tutorial에서 아이디어를 얻었습니다.

그것은 공식 소스에서 얻은 것입니다. 좋은 연습이라고 생각합니다.하지만 나에게 이것은 약간 번거로운 것 같습니다. React에서 콜백 함수를 전달할 수있는 다른 방법이 있습니까? 더 짧거나 간략합니까?

+1

이것은 모범 사례입니다. –

답변

0

React가 Context인데, 저자는 명시 적으로 처리기를 뛰어난 접근 방식으로 전달한다고 생각하지만이 작업을 단순화했습니다.

관련 문제