React里面 div里面是video 点击事件无效

Question

React里面 div里面是video 点击事件无效，因为我点击预加载图片要播放视屏 怎么实现呢

<div className="video" onClick={this.a1a1a1a1a1}>
            <video
              id="video1"
              ref={this.myRef}
              controls
              className="videoItme"
              webkit-playsinline="true"
              playsinline="true"
              oncontextmenu="return false;"
              preload="meta"
              poster=""
            >
              <source src=""></source>
            </video>
          </div>
          
         
     a1a1a1a1a1 = () => {
       console.log(this.myRef.current);
       console.log("来了");
    };

我现在要知道啥时候点击了当前的 video 元素 该怎么写呢

Answer 1

video在底层吧 onclick事件给阻止冒泡了，所以我们的点击是无效的，解决方案就是放一个预加载的图片，先把video隐藏，点击图片（播放），展示出来video，隐藏掉图片