Reactjs 访问componentDidMount外部的播放器变量

我是新手。我正在尝试将VideoJS与react集成。我在这里试图实现的是，当用户观看完视频的前30秒时，触发一个API调用。我正在使用一个名为timeCheck（）的方法监视时间。播放器实例是在componentDidMount（）生命周期下创建的。我面临的挑战是无法从timeCheck（）方法访问player变量

从“React”导入React；
从“video.js”导入videojs；
导入“video.js/dist/video js.css”；
类VideoPlayer扩展了React.Component{
componentDidMount（）{
this.player=videojs（this.videoNode，this.props，函数onPlayerReady（））{
console.log（'onPlayerReady'，this）
});
this.player.on（'timeupdate'，this.timeCheck）
}
组件将卸载（）{
if（this.player）{
this.player.dispose（）
}
}
updateView（）{
console.log（'添加了另一个视图'）
}
时间检查（）{
如果（this.player.currentTime（）>50）{
this.player.off（'timeupdate'，this.timeCheck）
console.log（'超过50秒…'）
这个.player.trigger（'Played50Seconds'）
}
否则{
console.log（'Counter ticking….'）
}
}
render（）{
返回(
这是一个播放器组件
this.videoNode=node}className=“video js”>
)
}
}
导出默认视频播放器

错误消息

index.js:1 VIDEOJS:ERROR:TypeError:this.player.currentTime不是 功能 at Player.timeCheck（VideoPlayer.js:25） 位于htmldevelment.data.dispatcher（video.es.js:1899） 触发时（video.es.js:2035） 在Player.trigger$1[作为触发器]（video.es.js:2921） 在玩家面前。[作为handleTechTimeupdate]（video.es.js:25658） 位于HTMLVideoElement.data.dispatcher（video.es.js:1899）

---

为什么不在类外部初始化同一个变量，并在类循环方法上不断重置该变量，这就是您可以在任何地方访问它的方式。

import React from 'react';
import videojs from 'video.js';
import 'video.js/dist/video-js.css';

class VideoPlayer extends React.Component {

    componentDidMount() {
        this.player = videojs(this.videoNode, this.props, function onPlayerReady() {
            console.log('onPlayerReady', this)
        });
        this.player.on('timeupdate', this.timeCheck)
    }

    componentWillUnmount() {
        if (this.player) {
            this.player.dispose()
        }
    }

    updateView() {
        console.log('Another view added')
    }

    timeCheck() {
        if (this.player.currentTime() > 50) {
            this.player.off('timeupdate', this.timeCheck)
            console.log('Breached 50 seconds...')
            this.player.trigger('Played50Seconds')
        }
        else {
            console.log('Counter ticking.....')
        }
    }

    render() {
        return (
            <div>
                <h3> It's a player component </h3>
                <div data-vjs-player>
                    <video ref={node => this.videoNode = node} className="video-js"></video>
                </div>
            </div>
        )
    }
}

export default VideoPlayer