handlers: {
image: () => {
let fileInput = this.$refs['myTextEditor'].$el.querySelector('input.ql-image[type=file]')
if (!fileInput) {
fileInput = document.createElement('input')
fileInput.setAttribute('type', 'file')
fileInput.setAttribute('name', 'file')
fileInput.setAttribute('accept', 'image/*')
fileInput.classList.add('ql-image')
fileInput.style.display = 'none'
fileInput.addEventListener('change', () => {
const imgs = this.value && this.value.match(/<img.*?/g)
if (imgs && imgs.length >= 12) {
this.$message({
type: 'warning',
message: '最多上传12张图片'
})
return
}
const file = fileInput.files[0]
const valid = checkPicTypeAndSize(file, {PICTURE_MAX_SIZE: 3 * 1024 * 1024, PICTURE_MAX_TIP: '3MB'})
if (!valid) {
return
}
toBase64(file).then((data) => {
const index = (this.$refs['myTextEditor'].quill.getSelection() || {}).index || this.$refs['myTextEditor'].quill.getLength()
this.$refs['myTextEditor'].quill.insertEmbed(index, 'image', data )
})
fileInput.value = ''
})
this.$refs['myTextEditor'].$el.appendChild(fileInput)
}
fileInput.click()
}
}