v-html에서 스크립트를 실행하는 방법

v-html에서 스크립트를 실행하는 방법

데이터베이스에서 임베드 코드(인스타그램, 트위터 등)를 가져옵니다.vue 컴포넌트에 바인드하는 방법v-html에서 스크립트 태그를 실행할 수 있는 방법이 있습니까?

간단한 답변:그럴수는 없어요.브라우저는 돔이 로드되면 스크립트 태그 실행을 차단합니다.

장황한 답변:스크립트의 src Atribut을 대조하여 취득+평가하거나 div의 내부 콘텐츠와 대조하여 평가할 수 있지만 이는 권장되지 않습니다.

제목 목적상 브라우저는 사용자를 차단합니다.

다만, 질문의 목적상, 서포트하고 싶은 임베드 코드를 간단하게 예측/목록 할 수 있기 때문에, 다음의 조작을 실시할 수 있습니다.

if (window.twttr) {
  // The script is already loaded, so just reload the embeds
  window.twttr.widgets.load();
} else if (!document.getElementByID('twttr-widgets')) {
  const embed = document.createElement('script');
  embed.id = 'twttr-widgets'
  embed.src = 'https://platform.twitter.com/widgets.js';
  document.body.appendChild(embed);
  // And when the script loads, the embeds will load too
}

페이지의 모든 위젯을 "다시 로드"할 수 있는 대부분의 내장 라이브러리에서 쉽게 복제할 수 있습니다.

• 페이스북 FB.XFBML.parse
• 트위터 twttr.widgets.load
• 인스타그램 instgrm.Embeds.process

언급URL : https://stackoverflow.com/questions/44595657/how-to-run-script-in-v-html