작업이 componentDidMount 내에서 작동하지 않습니다.

Question

내 응용 프로그램에서 react-redux를 사용하고 있습니다. 나는 선수가 있고 나는 비디오 js를 위해 rangesliderplugin을 사용했다. 나는 비디오 타임 라인에서 슬라이더를 슬라이드 할 때 트리거되어야하는 액션 크리에이터를 가지고 있습니다. 거기에는 https://github.com/danielcebrian/rangeslider-videojs에 주어진 플러그인이 있습니다. 이 이벤트 함수에서 내 액션에 값을 전달하고 싶습니다. 여기

newMarkerTime 내 행동

class PlayerLogic extends Component { 
    constructor() { 
     super(); 
     this.state = { 
      player: {} 
     }; 
    } 

    componentDidMount() { 
     var self = this; 
     var options ={hidden:false}; 
     var player = videojs(this.refs.video, this.props.options).ready(function() { 
      self.player = this; 
      self.player.on('play', self.handlePlay); 
     }); 
     player.rangeslider(options); 
     player.on("sliderchange",function() { 
      values = player.getValueSlider(); 
      this.props.newMarkerTime(values); 
     }); 

내가 슬라이더를 할 때 이런 오류가주고 내 코드입니다.

Answer 1

당신은 여기에 지방 화살표를 사용하거나 근무

player.on("sliderchange",function() { 
    values = player.getValueSlider(); 
    // this refers to player 
    this.props.newMarkerTime(values); 
    // self refers to your component 
    self.props.newMarkerTime(values); 
}); 

// use a fat arrow instead 
player.on("sliderchange",() => { 
    values = player.getValueSlider(); 
    // this refers to your react component 
    this.props.newMarkerTime(values); 
});