2016-09-12 1 views
4

저는 Quill을 사용하고 싶지만 편집기 툴바 (또는 "버블"대안)를 표시하고 싶지는 않습니다. 필자는 Quill/Parchment가있는 텍스트 영역을 원합니다.툴바없이 퀼 에디터를 만드는 방법은 무엇입니까?

그러나 새 Quill 요소를 만들 때마다 항상 묻지는 않지만 항상 툴바를 얻습니다. 또한 도구 모음을 제거하면 JavaScript 오류가 발생하여 페이지에서 실행중인 다른 내용이 손상됩니다.

기본 : 빈 객체에 모듈을 설정

var config = { 
 
    "theme": "snow" 
 
}; 
 

 
var quill = new Quill(".editor", config);
<script src="https://cdn.quilljs.com/1.0.3/quill.js"></script> 
 
<link href="https://cdn.quilljs.com/1.0.3/quill.snow.css" rel="stylesheet"/> 
 

 
<div class="editor"></div>

이 동일 (나는이 어쨌든 기본이라고 생각) :

var config = { 
 
    "theme": "snow", 
 
    "modules": {} 
 
}; 
 

 
var quill = new Quill(".editor", config);
<script src="https://cdn.quilljs.com/1.0.3/quill.js"></script> 
 
<link href="https://cdn.quilljs.com/1.0.3/quill.snow.css" rel="stylesheet"/> 
 

 
<div class="editor"></div>

자바 스크립트 오류 false 또는 null 중 결과 툴바 모듈 설정 :

var config = { 
 
    "theme": "snow", 
 
    "modules": { 
 
     "toolbar": false 
 
    } 
 
}; 
 

 
var quill = new Quill(".editor", config);
<script src="https://cdn.quilljs.com/1.0.3/quill.js"></script> 
 
<link href="https://cdn.quilljs.com/1.0.3/quill.snow.css" rel="stylesheet"/> 
 

 
<div class="editor"></div>

var config = { 
 
    "theme": "snow", 
 
    "modules": { 
 
     "toolbar": null 
 
    } 
 
}; 
 

 
var quill = new Quill(".editor", config);
<script src="https://cdn.quilljs.com/1.0.3/quill.js"></script> 
 
<link href="https://cdn.quilljs.com/1.0.3/quill.snow.css" rel="stylesheet"/> 
 

 
<div class="editor"></div>
다음

내가 원하는 무엇을, 그러나 이것은 해키 해결 방법처럼 보인다 나는 그것을 좋아하지 않는다 :

,363,210

var config = { 
 
    "theme": "snow", 
 
    "modules": { 
 
    "toolbar": ".quill-always-hidden-toolbar" 
 
    } 
 
}; 
 

 
var quill = new Quill(".editor", config);
.quill-always-hidden-toolbar{ 
 
    display: none; 
 
    visibility: hidden; 
 
    width: 0; 
 
    height: 0; 
 
} 
 

 
.quill-always-hidden-toolbar.ql-toolbar.ql-snow + .ql-container.ql-snow{ 
 
    border-top: 1px solid #ccc; 
 
}
<link href="https://cdn.quilljs.com/1.0.3/quill.snow.css" rel="stylesheet"/> 
 
<script src="https://cdn.quilljs.com/1.0.3/quill.js"></script> 
 

 
<div class="quill-always-hidden-toolbar"></div> 
 
<div class="editor"></div>

하지하는 방법은 도구 모음은 항상 display: none 인 DOM 노드로 렌더링의 짧은 퀼 편집기에가있다 없다가 나타납니다. 사실입니까, 아니면 이 도구 모음을 렌더링하지 않는 좀 더 우아한 방법입니까?

tl; dr : 툴바를 원하지 않습니다. 툴바없이 새로운 퀼 인스턴스를 만들려면 어떻게해야합니까?

도구 모음에 대한 falsy 값이 정확해야

답변

6

(당신은 this JSFiddle에서 서로 다른 설정 옵션을 자신과 함께 재생할 수 있습니다) :

var config = { 
    "theme": "snow", 
    "modules": { 
     "toolbar": false 
    } 
}; 

여기 추적을위한 bug report입니다.

+0

퀼 1.0.4부터 수정. SO에 대해 관심을 가져 주셔서 감사합니다! – rockerest