vue wangeditor

<script src="@Url.Content("~/static/kj/wangEditor.min.js")">

</script>

               // 创建编辑器
                createEditor() {
                    var E = window.wangEditor;
                    this.editor = new E(this.$refs.editorElem); //创建富文本实例
                    this.editor.customConfig.uploadImgTimeout = 3 * 60 * 1000; // 设置超时时间 3分钟
                    this.editor.customConfig.menus = [
                        'head', 'fontSize', 'fontName', 'italic', 'underline', 'strikeThrough', 'foreColor',
                        'backColor', 'link', 'list',
                        'justify', 'quote', 'emoticon', 'image', 'table', 'code', 'undo', 'redo' // 重复
                    ];
                    this.editor.customConfig.debug = true; // debug模式
                    this.editor.customConfig.uploadImgServer = '/Uploader/UpLoadImg';
                    //editor.customConfig.uploadImgServer = '/Uploader/UpLoadFolderImg?fd=WangEditorUploadImg&thumb=1';

                    this.editor.customConfig.uploadFileName = 'myFileName'; // 图片流name
                    this.editor.customConfig.uploadImgHooks = {
                    };
                    this.editor.customConfig.uploadImgHooks = {
                        customInsert: function(insertImg, result, editor) {
                            // 图片上传并返回结果,自定义插入图片的事件(而不是编辑器自动插入图片!!!)
                            // insertImg 是插入图片的函数,editor 是编辑器对象,result 是服务器端返回的结果
                            // 举例:假如上传图片成功后,服务器端返回的是 {url:'....'} 这种格式,即可这样插入图片:
                            // result 必须是一个 JSON 格式字符串!!!否则报错
                            var urlPath = result.Data;
                            var url = urlPath;
                            insertImg(url);
                        }
                    }
                    this.editor.customConfig.withCredentials = true; // 跨域携带cookie
                    this.editor.customConfig.uploadImgShowBase64 = true; // 使用 base64 保存图片
                    this.editor.create(); // 创建
                    //editor.txt.html(content); // 为编辑器赋值
                },

                GetModel: function() {
                    var self = this;
                    sa.ajax('/Memberships/Activitys/GetModel/@ViewBag.id',
                        {},
                        function(res) {
                            if (res != null) {
                                self.model = res;
                                this.editor.txt.html(this.model.VipRule); //为编辑器赋值
                               
                            } // 数据
                        }.bind(this),
                        { type: "get" });
                },

                mounted: function() {
 
                if (@ViewBag.Id != 0) {
                    this.GetModel();
                };
                this.createEditor(); // 创建富文本编辑器
            }

参考文章:

wangeditor
https://www.cnblogs.com/ingxx/p/7995500.html
https://blog.csdn.net/lhjuejiang/article/details/84671518
https://www.jianshu.com/p/b7bf0a5ed344

此随笔或为自己所写、或为转载于网络。仅用于个人收集及备忘。

原文地址:https://www.cnblogs.com/shy1766IT/p/13383700.html