在 mo ---tinymce 下面的plugins 新建一个uploadimage--index.js文件
/**
* 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, //设置上传图片的路由，配置在初始化时
?????????style: ‘display:none‘,
?????????method: ‘post‘,
?????????enctype: ‘multipart/form-data‘
???????}
?????);
?????form.append(input_f);
?????//ajax提交表单
?????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: ‘上传图片‘,
???onclick: selectLocalImages
?});
?editor.addMenuItem(‘uploadimage‘, {
???icon: ‘image‘,
???text: ‘上传图片‘,
???context: ‘tools‘,
???onclick: selectLocalImages
?});
});使用的时候 ?先引进来
import ‘tinymce/plugins/uploadimage‘
初始化的时候
upload_image_url: ‘/tinymce‘, //配置的上传图片的路由
plugins: ‘link lists image code table colorpicker textcolor wordcount contextmenu uploadimage‘,
toolbar:
?‘bold italic underline strikethrough | fontsizeselect | forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist | outdent indent blockquote | undo redo | link unlink ?code uploadimage | removeformat ‘,
vue --tinymce 解决上传图片的方法
原文地址：https://www.cnblogs.com/wypweb/p/9441771.html