Vuejs:用quilljs全屏编辑器

Question

我试图在我的vue-2应用程序中用"vue-quill"："^1.5.0-0“编写一个丰富文本的编辑器。一切都很好，但我需要全屏按钮的全屏和正常屏幕上的按钮单击。我试过了：全屏按钮，为毛刺编辑器？，它似乎不是我要找的东西。它是全面筛选full网站的完整页面，而不是编辑区域本身。有任何方法来做它的附加插件吗？

现在我有：

模板：

 <quill v-model="feedback.content" :config="quillConfig" output="html"></quill>

剧本：

quillConfig: {
        modules: {
          toolbar: [
            [{ direction: "rtl" }],
            ["bold", "italic", "strike"],
            // [{ header: 1 }, { header: 2 }],
            [{ list: "bullet" }, { list: "ordered" }],
            // [{ script: "sub" }, { script: "super" }],
            [{ indent: "-1" }, { indent: "+1" }],
            // [{ size: ["small", false, "large", "huge"] }],
            // [{ header: [1, 2, 3, 4, 5, 6, false] }],
            // [{ font: [] }],
            // [{ color: [] }, { background: [] }],
            ["image", "video"],
            [{ align: [] }],
            ["fullscreen"]
            // ["clean"]
          ]
        },
        placeholder: "add content",
        theme: "snow"
      }

​

​

我需要：

​

​

如果有人以前修过这个，请帮忙。

Answer 1

你提到的答案是正确的。您只需调用“请求”函数，将编辑器作为参数传递。

有点像

const htmlEditorContainer = document.querySelector('.p-editor-container')
screenfull.request(htmlEditorContainer);

这样，只有编辑器是可见的，而页面是全屏的。

相应的官方API是Element.requestFullscreen()。