반응시 함수 호출

Question

다른 클래스 및 파일에서 _toggleDropdown 또는 _onWindowClick 함수를 어떻게 호출합니까?

DropDown.js

export default class DropDown extends React.Component { 

    _toggleDropdown(e) { 
    e.preventDefault() 
    this.setState({ 
     isActive: !this.state.isActive 
    }) 
    } 

    _onWindowClick(event) { 
    const dropdownElement = findDOMNode(this) 
    if (event.target !== dropdownElement && !dropdownElement.contains(event.target) && this.state.isActive) { 
     this.setState({ 
     isActive: false 
     }) 
    } 
    } 
} 

Header.js

<a onClick={what???}>test</a> 

Answer 1

내에서 DropDown 구성 요소가 렌더링되는 경우 refs을 사용하여 드롭 다운 인스턴스를 가져 와서 해당 메서드를 호출 할 수 있습니다.

Header.js 그들은 당신이 플럭스 REDUX 같은 일부 글로벌 상태 관리 솔루션으로 로컬 상태에서 더 나은 스위치를 거라고 전혀 관련이없는 경우

render() { 
    return (<div> 
     <DropDown ref="dd"/> 
     <a onClick={e => this.refs.dd._toggleDropdown(e)}>Toggle</a> 
    </div>) 
} 

. 그리고 대응 행동을 파견함으로써 어떤 구성 요소도 바뀔 수있는 글로벌 애플리케이션 상태의 일부가되도록 드롭 다운 상태로 만듭니다.

Answer 2

그런데 이런 종류의 일을 할 수있는 유일한 방법은 헤더 구성 요소에 소품으로 기능을 전달하는 것입니다. 나는 당신의 구조가 결과와 함께 깨끗한 발췌 문장을 만들지 확신하지 못한다. 어쩌면 당신이 쉽게 사용할 수 있도록 디자인이 명확하지 않을 수도 있습니다.