동적 불러오기script 불러오기 리셋 이벤트 완료

3941 단어 React

머리말


웹 페이지에 많은 제3자 플러그인은 직접script 라이브러리에 도입하는 방식으로 불러옵니다. 스크립트를 불러오는 데 시간이 필요하기 때문에script가 불러오기 전에 라이브러리의 대상을 사용하면 오류가 발생할 수 있습니다.
솔루션
  • script DOM 객체 가져오기
  • 귀속onload 이벤트 비동기 리셋
  • 전체적인 사고방식은 이렇다
      asyncComplete() {
        return new Promise((reject, resole) => {
        // HTMLCollection 
        // js  
          const [twscript,] = document.getElementsByTagName('script');
          //ie
          if (twscript.readyState) {
            twscript.onreadystatechange = () => {
              if (twscript.readyState === "complete" || twscript.readyState === 'loaded') {
                reject()
              }
            }
          } else {
            twscript.onload = reject()
          }
        })
      }
      
    

    사용법
    // 
    
      async mountd() {
        await this.asyncComplete();
        //TODO
      }
    
    

    좋은 웹페이지 즐겨찾기