react搭配h5原生video标簽手寫網頁播放器

前言： 樓主也剛接觸react不久，項目寫的可能也不是很雅緻，隻是做了就發出來給有需求的小夥伴參考參考。如果寫的不妥，還請小夥伴指正開導下。

搭建環境

本次開發，主要是用node做項目的依賴管理，同時使用webpack進行打包。請確定運作項目前已安裝這兩樣利器。

項目結構

深坑

整個項目過程還算流暢，唯獨在處理全屏狀态下監聽esc和f11按鍵的時候多花了點時間。網上很多方法我也都參考試了一下，可能是我打開的方式不對，or ？？？。還好功夫不負有心人，終于還是看到的了一種解決方法，下面直接給出方法：

window.onresize = function(){
    if(!checkFull()){
    //要執行的動作
    } 
  }

function checkFull(){
  var isFull = document.fullscreenEnabled || window.fullScreen || document.webkitIsFullScreen || document.msFullscreenEnabled;

  //to fix : false || undefined == undefined
  if(isFull === undefined) isFull = false;
  return isFull;
}
      

tips

1. .vscode 目錄是我用的編輯器的配置檔案，沒什麼關系，不用管
2. node_modules 目錄下是項目所需要的依賴包
3. src目錄下是項目源碼

項目位址

話不多說，傳送門：https://gitee.com/linxiaofen/react-video