mounted() {
let quill = this.$refs.myQuillEditor.quill;
quill.root.addEventListener(
"paste",
(evt) => {
if (
evt.clipboardData &&
evt.clipboardData.files &&
evt.clipboardData.files.length
) {
evt.preventDefault();
[].forEach.call(evt.clipboardData.files, (file) => {
if (!file.type.match(/^image\/(gif|jpe?g|a?png|bmp)/i)) {
return;
}
const formData = new FormData();
formData.append("file", file);
// this.$axios.post(`${this.$Tools.Conts.domain}uploads`, formData).then( 或
projectDevelopApi.uploadFile(formData).then(
res => { // 调用的接口
if(res.code==200){
this.uploadSuccess(res)
}else{
this.$message.error(res.errMsg);
}
// if (res.data.code == 0) {
// console.log(res.data.data.src)
// // window.open(res.data.data.src)
// let length = quill.getSelection().index; //光标位置
// // 插入图片地址
// quill.insertEmbed(length, "image", res.data.data.src);
// // 光标后移一位
// quill.setSelection(length + 1);
// } else {
// console.log(res.data)
// this.$message({
// message: res.data.message,
// type: 'warning'
// });
// }
})
});
}
},
false
);
},
methods:{
// 上传图片成功的回调
uploadSuccess (res) {
// 获取富文本组件实例
let quill = this.$refs.myQuillEditor.quill
// 如果上传成功
if (res) {
// 获取光标所在位置
let length = quill.getSelection().index;
// 插入图片,res为服务器返回的图片链接地址
// quill.insertEmbed(length, 'image', res.result.fileUrl)
// quill.insertEmbed(length, 'image', "/tycy-doc-manage"+res.data.fileUrl)
quill.insertEmbed(length, 'image', globalAgent + res.data.fileUrl)// globalAgent为全局定义的常量
// 调整光标到最后
quill.setSelection(length + 1)
} else {
// 提示信息,需引入Message
this.$message.error('图片插入失败!')
}
},
}