diff --git a/public/react/src/common/quillForEditor/FillBlot.js b/public/react/src/common/quillForEditor/FillBlot.js index 144b499ee..2f9414253 100644 --- a/public/react/src/common/quillForEditor/FillBlot.js +++ b/public/react/src/common/quillForEditor/FillBlot.js @@ -4,16 +4,17 @@ * @Github: * @Date: 2020-01-06 09:02:29 * @LastEditors : tangjiang - * @LastEditTime : 2020-01-09 11:58:52 + * @LastEditTime : 2020-01-09 15:00:13 */ import Quill from 'quill'; // let Inline = Quill.import('blots/inline'); -const BlockEmbed = Quill.import('blots/block/embed'); +const BlockEmbed = Quill.import('blots/embed'); class FillBlot extends BlockEmbed { static create (value) { - const node = super.cerate(); + const node = super.cerate(value); // node.classList.add('icon icon-bianji2'); // node.setAttribute('data-fill', 'fill'); + console.log('编辑器值===》》》》》', value); node.setAttribute('data_index', value.data_index); node.nodeValue = value.text; return node; @@ -28,7 +29,7 @@ class FillBlot extends BlockEmbed { } -FillBlot.blotName = "fill"; +FillBlot.blotName = "fill-blot"; FillBlot.tagName = "span"; export default FillBlot; diff --git a/public/react/src/common/quillForEditor/index.js b/public/react/src/common/quillForEditor/index.js index f892e9b8d..525feba09 100644 --- a/public/react/src/common/quillForEditor/index.js +++ b/public/react/src/common/quillForEditor/index.js @@ -4,7 +4,7 @@ * @Github: * @Date: 2019-12-18 08:49:30 * @LastEditors : tangjiang - * @LastEditTime : 2020-01-09 11:56:10 + * @LastEditTime : 2020-01-10 15:05:27 */ import './index.scss'; import 'quill/dist/quill.core.css'; // 核心样式 @@ -31,14 +31,16 @@ Quill.register(ImageBlot); Quill.register(Size); Quill.register(Font, true); // Quill.register({'modules/toolbar': Toolbar}); -Quill.register(FillBlot); +Quill.register({ + 'formats/fill': FillBlot +}); // Quill.register(Color); function QuillForEditor ({ placeholder, readOnly, - autoFocus, + autoFocus = false, options, value, imgAttrs = {}, // 指定图片的宽高 @@ -194,10 +196,11 @@ function QuillForEditor ({ }); _quill.getModule('toolbar').addHandler('fill', (e) => { + // console.log('点击了填空=====>>>>>>', e); setFillCount(fillCount + 1); const range = _quill.getSelection(true); // _quill.insertText(range.index, '▁', { 'data_index': fillCount }); - _quill.insertEmbed(range.index, 'span', { + _quill.insertEmbed(range.index, 'fill', { text: '▁', 'data_index': fillCount }); @@ -229,16 +232,21 @@ function QuillForEditor ({ } const current = value - // console.log('+++++', current); if (!deepEqual(previous, current)) { setSelection(quill.getSelection()) if (typeof value === 'string') { - quill.clipboard.dangerouslyPasteHTML(value, 'api') + quill.clipboard.dangerouslyPasteHTML(value, 'api'); + if (autoFocus) { + quill.focus(); + } else { + quill.blur(); + } } else { quill.setContents(value) + if (autoFocus) quill.focus(); } } - }, [quill, value, setQuill]); + }, [quill, value, setQuill, autoFocus]); // 清除选择区域 useEffect(() => { @@ -272,13 +280,6 @@ function QuillForEditor ({ } }, [quill, handleOnChange]); - useEffect(() => { - if (!quill) return; - if (autoFocus) { - quill.focus(); - } - }, [quill, autoFocus]); - // 返回结果 return (
diff --git a/public/react/src/modules/developer/newOrEditTask/leftpane/editorTab/index.js b/public/react/src/modules/developer/newOrEditTask/leftpane/editorTab/index.js index 349404dfd..6fc264663 100644 --- a/public/react/src/modules/developer/newOrEditTask/leftpane/editorTab/index.js +++ b/public/react/src/modules/developer/newOrEditTask/leftpane/editorTab/index.js @@ -4,7 +4,7 @@ * @Github: * @Date: 2019-11-20 10:35:40 * @LastEditors : tangjiang - * @LastEditTime : 2020-01-09 14:18:37 + * @LastEditTime : 2020-01-10 15:06:23 */ import './index.scss'; // import 'katex/dist/katex.css'; @@ -453,6 +453,7 @@ class EditTab extends React.Component { colon={ false } >