2017-09-09 93 views
1

を挿入するときにネストブロック要素を作成し、私は、ビデオを埋め込むときに、この構造で終わるしたい:Quill.js:埋め込み動画

<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);とを挿入することができます。しかし、上記のようにdiviframeを追加するにはどうすればよいですか?

答えて

0

マニュアルでも実際は非常に簡単です(このようなことを行うための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; 
    } 
} 
関連する問題