Vue--TINYMCE Solutions for uploading images

Create a new uploadimage--index.js file under Mo---tinymce plugins

/**
* Created by DELL on 2018/8/7.
*/
/**
* TINYMCE Plugin
* Created by Jerry on 16/8/5.
*/
TinyMCE. Pluginmanager.add (' Uploadimage ', function (editor) {

function Selectlocalimages () {
var dom = Editor.dom;
var input_f = $ (' <input type= "file" name= "thumbnail" accept= "image/jpg,image/jpeg,image/png,image/gif" multiple= " Multiple ">");
Input_f.on (' Change ', function () {
var form = $ ("<form/>",
{
Action:editor.settings.upload_image_url,//Set the route for uploading pictures, configure at initialization
Style: ' Display:none ',
Method: ' Post ',
Enctype: ' Multipart/form-data '
}
);
Form.append (Input_f);
Ajax Submission Form
Form.ajaxsubmit ({
Beforesubmit:function () {
return true;
},
Success:function (data) {
if (data && Data.file_path) {
Editor.focus ();
Data.file_path.forEach (function (src) {
Editor.selection.setContent (dom.createhtml (' img ', {SRC:SRC}));
})
}
}
});
});

Input_f.click ();
}

Editor.addcommand ("Mceuploadimageeditor", selectlocalimages);

Editor.addbutton (' Uploadimage ', {
Icon: ' Image ',
ToolTip: ' Upload image ',
Onclick:selectlocalimages
});

Editor.addmenuitem (' Uploadimage ', {
Icon: ' Image ',
Text: ' Upload image ',
Context: ' Tools ',
Onclick:selectlocalimages
});
}); When you use it, bring it in first.

Import ' Tinymce/plugins/uploadimage '

The time of initialization

Upload_image_url: '/tinymce ',//Configuring the routing of uploaded images

uploadimage',
Toolbar
  ' Bold Italic underline strikethrough | Fontsizeselect | ForeColor BackColor | AlignLeft aligncenter alignright alignjustify | Bullist Numlist | Outdent Indent blockquote | Undo Redo | Link unlink  uploadimage | Removeformat ',

Vue--TINYMCE Solutions for uploading images