小编Mik*_*but的帖子

你好!

我正在尝试使用ReactJS下的canvas元素.当我调用drawImage()时,我收到一个错误.一切都工作,除了drawImage()..？

未捕获的TypeError:无法在'CanvasRenderingContext2D'上执行'drawImage':提供的值不是'(HTMLImageElement或HTMLVideoElement或HTMLCanvasElement或ImageBitmap)'

var Canvas = React.createClass({
    componentDidUpdate: function() {
        console.log("componentDidUpdate");
    },

    componentDidMount: function() {
        var context = this.getDOMNode().getContext('2d');
        this.paint(context);
    },

    paint: function(context) {
        context.save();
        context.fillStyle = '#F00';
        context.fillRect(0, 0, 400, 400);
        context.drawImage("image.jpg", 0, 0);
        context.restore();
    },

    render: function(){
        return <canvas width={400} height={400} />;
    }
});

我收到错误,我没有找到任何线索,我正在使用videojs来控制滑块中的多个视频,在每个完成的转换中,我调用一个新的videojs实例并将ID存储到变量并dispose()旧的视频.因为我有很多幻灯片(或视频),并且想要在没有活跃的性能时杀死它们.我的滑块在TweenMax下工作..我从Timline调用onStart事件中的dispose().当调用dispose()时,我收到此错误:

未捕获的TypeError:无法读取null的属性"vdata1408997779453"

这是我的代码示例:

var $slides = [],
    videos =[],
    currentSlide = 0,
    currentVideo = null;

$(function(){

    TweenLite.to($('#header-wrap'), 1, {
            left: x,
            onStart: function(){
                if(currentVideo) {
                    TweenMax.set($('.video-holder'), {autoAlpha: 0});
                    currentVideo.dispose();
                }
            },

            onComplete: function() {
                if(videos[slideActive].url) {
                        videojs('movie-video-holder-'+slideActive+'', {"autoplay": false, "preload": "auto", "controls": false, "lopp": false}, function(){
                            currentVideo = $vid;
                            [...]
                        });
                }
            }
    [...]

谢谢!