윈도우 이벤트 리스너에서 리 페칭 액션을 디스패치

컨테이너/ui_component 패턴을 따라 redux 디스패치 액션을 부모 컨테이너의 ui_component로 전달합니다. ui_component의 render 메서드 내에서 파견 작업을 성공적으로 호출 할 수 있습니다. 예를 들어 아래의 onClick 이벤트는 정상적으로 작동합니다.윈도우 이벤트 리스너에서 리 페칭 액션을 디스패치

내 문제는 동일한 구성 요소 내에서 eventListener (handleResize)에서 동일한 작업을 수행 할 수 없다는 것입니다.

import React, { Component, PropTypes } from 'react'; 
import { Link } from 'react-router'; 
import classNames from 'classnames'; 


class Dashboard extends Component { 
    constructor(props) { 
    super(props); 
    this.props.updateDashVis.bind(this); // not sure if this is doing anything 
    } 

    static contextTypes = { 
    router: PropTypes.object 
    }; 


    handleResize() { 
    this.props.updateDashVis('app-dash'); // returns undefined 
    } 

    componentDidMount() { 
    window.addEventListener('resize', this.handleResize); 
    } 

    componentWillUnmount() { 
    window.removeEventListener('resize', this.handleResize); 
    } 

    componentWillUnmount() { 
    this.props.resetMe(); 
    } 



    render() { 
     return (

     // ... 
     <div className="top-bar"> 

      <div className="burger" onClick={()=> {this.props.updateDashVis(this.props.appDashVis)}} ><i className="fa fa-bars" aria-hidden="true"></i></div> 
      {/* onClick works fine and action is fired */} 

     </div> 

     // ... 


    ); 
    } 
} 

export default Dashboard

이것은 제 첫 번째 React/Redux/ES6 프로젝트이므로 매우 간단 할 수 있습니다. 모든 안내가 환영받을 것입니다.

출처

2016-07-18 Stewart Ellis

. 어딘가에 농담이 있습니다 ... –

그것을 알아 냈습니다. 인수가 필요하지 않은 새 액션을 만든 다음 이벤트 핸들러에 바인딩했습니다. componentDidMount() { window.addEventListener ('resize', this.props.hideDash); } componentWillUnmount () window.removeEventListener ('resize', this.props.hideDash); } –

자신의 질문에 대답하고 답을 표시하십시오. 그렇게하면 다른 사람들이 당신의 솔루션으로부터 이익을 얻을 수 있습니다! –

메서드 'updateDashVis'은 생성자에서 바인딩이 필요없는 소포를 통해 전달되지만 생성자에서 'this'참조를 handleResize 메서드에 바인드해야합니다. 그래서 생성자는 ... 아래 싶습니다

constructor(props) { 
super(props); 
this.handleResize = this.handleResize.bind(this);

}, "윈도우 이벤트 리스너"하지 과부 말을 의미

출처

2016-07-18 22:22:35

윈도우 이벤트 리스너에서 리 페칭 액션을 디스패치

답변

관련 문제