UEditor（集成 135 编辑器插件）（附源码）

效果图

可以看到第一个菜单是135，点击135跳到135编辑器，点击完成编辑即可

准备工作

1.npm

npm install vue-ueditor-wrap
// 或者
yarn add vue-ueditor-wrap

2下载UEditor，

UEditor 官网下载链接我这边后台是java我下载jsp版本

解压

将解压的文件夹重命名为 UEditor 并移动到你项目的静态资源目录下

添加 135 插件添加135插件文档

（1）下载

135editor.js
135EditorDialogPage.html

（2）.放置文件

135editor.js文件放到 public/static/ueditor/_src/plugins 文件夹下
135EditorDialogPage.html文件放到public/static/ueditor/dialogs/135editor 文件夹下没有135editor文件夹需要新建）

（3）. 修改配置文件
在 ueditor.config.js 中 toolbars 项里增加一个 135editor 菜单项

  toolbars: [ ['135editor', 'fullscreen', 'source', '|',  'undo', redo', .... ]]

（4）添加css(在src/components/UEditor/index.vue 文件里添加）

.edui-button.edui-for-135editor.edui-button-wrap.edui-button-body.edui-icon {background-image: url("http://static.135editor.com/img/icons/editor-135-icon.png") !important;background-size: 85%;background-position: center;background-repeat: no-repeat;
}

引入且使用VueUeditorWrap组件

import VueUeditorWrap from 'vue-ueditor-wrap' // ES6 Module<vue-ueditor-wrapv-model="detailHtml":config="myConfig"editor-id="editor-demo-01"></vue-ueditor-wrap>data () {return {myConfig:{toolbars: [['135editor',// 135编辑'undo', //撤销'bold', //加粗'indent', //首行缩进'italic', //斜体'underline', //下划线'strikethrough', //删除线'subscript', //下标'fontborder', //字符边框'superscript', //上标'formatmatch', //格式刷'fontfamily', //字体'fontsize', //字号'justifyleft', //居左对齐'justifycenter', //居中对齐'justifyright', //居右对齐'justifyjustify', //两端对齐'insertorderedlist', //有序列表'insertunorderedlist', //无序列表'lineheight',//行间距]]     },
}
}

源码

关注公众号《源码好又多》回复 135 获取源码

作者相关文章

零基础搭建获利的美团饿了么优惠券CPS小程序(附源码)

反编译获取任何微信小程序源码——看这篇就够了

如何获取美团饿了么的推广链接赚钱

UEditor（集成 135 编辑器插件）（附源码）相关推荐

Django集成Markdown编辑器【附源码】
专注内容写作的你一定不要错过markdown 简单介绍 markdown是一种标记语言,通过简单的标记语法可以使普通的文本内容具有一定的格式,使用非常简单,学习成本极低目前各大Blog平台都已支持m ...
用GO语言开发editplus编辑器插件(附源码)
我要开发的插件功能极为简单,就是对用户选中的内容进行base64编码或解密工作. 其中所涉及的技术部分主要是GO语言程序开发和editplus插件配置的部分,首先我们来看一下GO语言代码的写法,如下: ...
Asp.NetCoreWebApi图片上传接口(二)集成IdentityServer4授权访问(附源码)
写在前面本文地址:http://www.cnblogs.com/yilezhu/p/9315644.html 作者:yilezhu 上一篇关于Asp.Net Core Web Api图片上传的文章使 ...
自定义Visual Studio.net Extensions 开发符合ABP vnext框架代码生成插件[附源码]
介绍我很早之前一直在做mvc5 scaffolder的开发功能做的已经非常完善,使用代码对mvc5的项目开发效率确实能成倍的提高,就算是刚进团队的新成员也能很快上手,如果你感兴趣可以参考 http ...
CSDN博客文章阅读模式插件(附源码)
插件地址:https://greasyfork.org/zh-CN/scripts/380667-csdn%E5%8D%9A%E5%AE%A2%E9%98%85%E8%AF%BB%E6%A8%A1%E ...
kindeditor集成135编辑器实现共同编辑文章
kindeditor是一款应用非常广泛的富文本编辑器,笔者在以前的多个项目中使用.135编辑器是一款在线编辑器,常用于微信端信息的编辑和发布.因为135编辑器自带了很多模板用起来很方便,所以我想把它编 ...
devexpress html编辑器,图解DevExpress RichEditControl富文本的使用，附源码及官方API
9点半了,刚写到1.2. 该回家了,明天继续写完. 大家还需要什么操作,留言说一下,没有的我明天继续加. 好久没有玩DevExpress了,今天下载了一个玩玩,发现竟然更新到14.2.5了..我去 ...
通用权限管理系统组件中集成多个子系统的单点登录(网站入口方式)附源码
通用权限管理系统组件 (GPM - General Permissions Manager) 中集成多个子系统的单点登录(网站入口方式)附源码上文中实现了直接连接数据库的方式,通过配置文件,自定义的 ...
Android富文本编辑器附源码
Android富文本编辑器附源码 1,源码分析本软件是Android端创建富文本数据,向服务器发送;安卓端创建数据可以是文字,图片,语音,文件,还可以录音,可以拍照.录音完毕保存的时候应该提交给服务 ...

UEditor（集成 135 编辑器插件）（附源码）

效果图

准备工作

1.npm

2下载UEditor，

解压

添加 135 插件添加135插件文档

引入且使用VueUeditorWrap组件

源码

作者相关文章

UEditor（集成 135 编辑器插件）（附源码）相关推荐

最新文章

热门文章

UEditor（集成 135 编辑器插件）（附源码）

效果图

准备工作

1.npm

2下载UEditor，

解压

添加 135 插件 添加135插件文档

引入且使用VueUeditorWrap组件

源码

作者相关文章

UEditor（集成 135 编辑器插件）（附源码）相关推荐

最新文章

热门文章

添加 135 插件添加135插件文档