tinyMCE.init()初始化方法中配置:
一、图片上传至服务器
images_upload_handler中上传图片,success()返回图片地址即可、
images_upload_handler: (blobInfo, success, failure) => {
this.handleImageAdded(blobInfo, success, failure)
},
// 插入图片的方法
async handleImageAdded(blobInfo, success, failure) {
let file = blobInfo.blob();
// console.log('图片', blobInfo, file)
const id = uuidv4();
const url = await this._getUrl(file);
const suffix = file.name.slice(file.name.lastIndexOf(".") + 1).toUpperCase(); // 获取后缀名
const newFileItem = {
id,
name: "",
url: url,
suffix: suffix,
status: "loading",
isDelete: true
};
// 上传
try {
this.setUpLoadData();
let formData = new FormData();
Object.keys(this.upLoadData).forEach(key => {
if (this.upLoadData[key]) {
formData.append(key, this.upLoadData[key]);
}
});
formData.append("file", file, file.name);
const result = await Request.post(API.file.uploader.create, formData);
// 上传成功回填修改数据
const path = result.path.replace(/\\/g, "/");
const fullPath = API.file.uploader.uploadIp + path; // 路径
success(fullPath);
// console.log(fullPath);
} catch (error) {
console.log(error);
return Promise.reject();
}
},
二、行高等功能配置
style_formats_merge: true,
style_formats: [{
title: '行高',
items: [
{ title: '1', styles: { 'line-height': '1' }, inline: 'span' },
{ title: '1.5', styles: { 'line-height': '1.5' }, inline: 'span' },
{ title: '2', styles: { 'line-height': '2' }, inline: 'span' },
{ title: '2.5', styles: { 'line-height': '2.5' }, inline: 'span' },
{ title: '3', styles: { 'line-height': '3' }, inline: 'span' }
]
}, {
title: '首行缩进',
block: 'p',
styles: { 'text-indent': '2em' }
},
],