Vuejs 2 : DOM에 스크립트 태그 javascript 파일을 동적으로 포함 (및 실행)하는 방법은 무엇입니까?

나는 Vuejs를 사용하고 있는데이 방법으로 JWPlayer 비디오를 포함하는 dynaically는 DOM에 스크립트 태그를 삽입해야합니다Vuejs 2 : DOM에 스크립트 태그 javascript 파일을 동적으로 포함 (및 실행)하는 방법은 무엇입니까?

<body> 
<!-- HTML content --> 
<script src="//content.jwplatform.com/players/KZVKrkFS-RcvCLj33.js"></script> 
<!-- More HTML content --> 
<script src="//content.jwplatform.com/players/ANOTHER-ID-ANOTHER-PLAYERID.js"></script> 
</body>

가 나는 결과없이 사용하고 있습니다 : V-HTML을 지시를 html 태그를 렌더링 할 수 있습니다. 마찬가지로 v-bind : src도 코드를 실행하지 않습니다. 이 솔루션을 찾았지만 작동하지 않았습니다. How to add external JS scripts to VueJS Components

이 솔루션을 사용했지만 스크립트 태그 (각 동영상마다 하나씩)는 본문 (머리가 아님)에 삽입해야합니다. div 태그 컨테이너를 만들고 포함해야합니다. 동영상들. 문제는 embeded JWPlayer 파일에 document.write() 문이 포함되어 있다는 것입니다. 그리고 브라우저 콘솔에 : "비동기 적으로로드 된 외부 스크립트에서 document.write() 호출이 무시되었습니다."

어쨌든 이것을 달성 할 수 있습니까?

출처

2017-12-12 Spleen-

글쎄, 당신이 연결 한 접근법에 무슨 문제가 있었습니까? 그것은 합리적인 것 같습니다. – Botje

당신이 작동해야 제공된 링크.

JWPlayer를 사용하려면 먼저 스크립트가로드 될 때까지 기다려야합니다.

const script = document.createElement('script') 

script.onload =() => { 
    // Now you can use JWPlayer in here 
} 

script.src = '//content.jwplatform.com/players/MEDIAID-PLAYERID.js' 
document.head.appendChild(script)

또한 JWPlayer가로드됩니다 이후 당신은 단지 그 시점에서, 그것을 필요로하는 첫 번째 구성 요소이 한 번 할 수 있는지 확인하고 다른 스크립트 태그를 삽입하지 않고 사용할 수 있습니다.

출처

2017-12-12 08:23:40

Vuejs 2 : DOM에 스크립트 태그 javascript 파일을 동적으로 포함 (및 실행)하는 방법은 무엇입니까?

답변

관련 문제