Quill.js는 : 영상을 임베딩시 I이 구조로 끝날하고자 퍼간

Question

를 삽입 할 때 중첩 블록 요소 생성 :

<div style="left: 0; width: 100%; height: 0; position: relative; padding-bottom: 56.2493%;"> 
    <iframe src="https://www.youtube.com/embed/8zHdLF3-coA?rel=0&showinfo=0" style="border: 0; top: 0; left: 0; width: 100%; height: 100%; position: absolute;" allowfullscreen scrolling="no"> 
    </iframe> 
</div> 

는 I 쉽게 quill.insertEmbed(range.index + 1, 'video', url, Quill.sources.USER);으로 를 삽입 할 수있다. 그런데 위와 같이 div에 iframe을 추가하려면 어떻게해야합니까?

Answer 1

매뉴얼이지만 실제로는 매우 간단합니다. (이 읷종의 일을하는 Quill의 방법이있을 것이라고 생각했습니다 ...). 누군가 더 나은 방법이 있다면 조언을 해주십시오!

export default class CustomVideoBlot extends BlockEmbed { 

static create(url) { 
    const node = super.create(); 
    const vidWrapper = <HTMLDivElement>document.createElement('div'); 
    // Set attributes on the iframe 
    node.setAttribute('frameborder', '0'); 
    node.setAttribute('allowfullscreen', true); 
    node.setAttribute('src', this.sanitize(url)); 
    // Set styles to the video wrapper 
    Object.assign(vidWrapper.style, WRAPPER_ATTRIBUTES); 
    // Append iframe as a child of the wrapper 
    vidWrapper.appendChild(node); 

    return vidWrapper; 
    } 
}