|
|
|
@ -30,7 +30,18 @@ export default { |
|
|
|
/* 编辑器的内容 */ |
|
|
|
value: { |
|
|
|
type: String, |
|
|
|
default: "", |
|
|
|
default: ` |
|
|
|
<p>这是一个公式:</p> |
|
|
|
<math xmlns="http://www.w3.org/1998/Math/MathML" class="math-formula"> |
|
|
|
<mrow> |
|
|
|
<mi>E</mi> |
|
|
|
<mo>=</mo> |
|
|
|
<mi>m</mi> |
|
|
|
<msup><mi>c</mi><mn>2</mn></msup> |
|
|
|
</mrow> |
|
|
|
</math> |
|
|
|
<p>这是普通段落。</p> |
|
|
|
` |
|
|
|
}, |
|
|
|
/* 高度 */ |
|
|
|
height: { |
|
|
|
@ -108,7 +119,8 @@ export default { |
|
|
|
if (val !== this.currentValue) { |
|
|
|
this.currentValue = val === null ? "" : val; |
|
|
|
if (this.Quill) { |
|
|
|
this.Quill.pasteHTML(this.currentValue); |
|
|
|
// this.Quill.pasteHTML(this.currentValue); |
|
|
|
this.Quill.clipboard.dangerouslyPasteHTML(this.currentValue); |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
@ -117,6 +129,11 @@ export default { |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
this.init(); |
|
|
|
this.$nextTick(() => { |
|
|
|
setTimeout(() => { |
|
|
|
this.renderMath(); |
|
|
|
}, 500); |
|
|
|
}); |
|
|
|
}, |
|
|
|
beforeDestroy() { |
|
|
|
this.Quill = null; |
|
|
|
@ -125,6 +142,7 @@ export default { |
|
|
|
init() { |
|
|
|
const editor = this.$refs.editor; |
|
|
|
this.Quill = new Quill(editor, this.options); |
|
|
|
console.log('Quill registered blots:', Quill.import('blots/bubble').blots); |
|
|
|
// 如果设置了上传地址则自定义图片上传事件 |
|
|
|
if (this.type == 'url') { |
|
|
|
let toolbar = this.Quill.getModule("toolbar"); |
|
|
|
@ -136,7 +154,9 @@ export default { |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
this.Quill.pasteHTML(this.currentValue); |
|
|
|
if (this.currentValue) { |
|
|
|
this.Quill.clipboard.dangerouslyPasteHTML(0, this.currentValue); |
|
|
|
} |
|
|
|
this.Quill.on("text-change", (delta, oldDelta, source) => { |
|
|
|
const html = this.$refs.editor.children[0].innerHTML; |
|
|
|
const text = this.Quill.getText(); |
|
|
|
@ -191,7 +211,17 @@ export default { |
|
|
|
this.$message.error("图片插入失败"); |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
renderMath() { |
|
|
|
if (window.MathJax && window.MathJax.typesetPromise) { |
|
|
|
window.MathJax.typesetPromise() |
|
|
|
.then(() => { |
|
|
|
console.log('✅ MathML 公式已渲染'); |
|
|
|
}) |
|
|
|
.catch(err => { |
|
|
|
console.error('❌ MathJax 渲染失败:', err); |
|
|
|
}); |
|
|
|
} |
|
|
|
}, |
|
|
|
fileToBase64(file) { |
|
|
|
return new Promise((resolve, reject) => { |
|
|
|
// 创建一个新的 FileReader 对象 |
|
|
|
|