uEditor富文本编辑器

在配合vue和webpack使用时，在严格模式下注意会报错，需要修改配置。

 

我采用的方式：————不建议全部取消严格模式，因为一些插件必须要再严格模式才能运行的
　　对UEditor的严格模式报错文件，取消严格模式：
      然后就没问题了。

{
  "presets": ["vue-app"],
　"ignore": [
　　　　'./src/assets/uEditor/ueditor.all.js'
　　]}

 

常用的方法：

1. 实例化编辑器到id为 container 的 dom 容器上：
   var ue = UE.getEditor('container');
2. 设置编辑器内容：
    ue.setContent('<p>hello!</p>');
3. 追加编辑器内容：
    ue.setContent('<p>new text</p>', true);
4. 获取编辑器html内容：
    var html = ue.getContent();
5. 获取纯文本内容：
    ue.getContentTxt();
6. 获取保留格式的文本内容：
    ue.getPlainTxt();
7. 判断编辑器是否有内容：
    ue.hasContents();
8. 让编辑器获得焦点：
    ue.focus();
9. 让编辑器失去焦点
    ue.blur();
10. 判断编辑器是否获得焦点：
    ue.isFocus();
11. 设置当前编辑区域不可编辑：
    ue.setDisabled();
12. 设置当前编辑区域可以编辑：
    ue.setEnabled();
13. 隐藏编辑器：
    ue.setHide();
14. 显示编辑器：
    ue.setShow();
15. 清空内容：
    ue.execCommand('cleardoc');
16. 读取草稿箱：
    ue.execCommand('drafts');
17. 清空草稿箱：
  ue.execCommand('clearlocaldata');

 

配置工具栏：

<script type="text/javascript" src="ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="ueditor/ueditor.all.min.js"> </script>
<script type="text/javascript" src="ueditor/lang/zh-cn/zh-cn.js"></script>
<script>
$(function() {
//本来是这样的:UE.getEditor('editor'); 传入参数后就是下面那样子了，toolbars里的就是工具的图标
UE.getEditor('editor', {
toolbar: [
['fullscreen', 'source', 'undo', 'redo', 'bold', 'italic', 
'underline','fontborder', 'backcolor', 'fontsize', 'fontfamily', 
'justifyleft', 'justifyright','justifycenter', 'justifyjustify', 'strikethrough','superscript', 'subscript', 'removeformat', 'formatmatch','autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor','insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc', 'link', 'unlink','emotion', 'help'] ] }); }) </script>  配置项里用竖线 ‘|’ 代表分割线 完整的按钮列表 toolbars: [ [ 'anchor', //锚点 'undo', //撤销 'redo', //重做 'bold', //加粗 'indent', //首行缩进 'snapscreen', //截图 'italic', //斜体 'underline', //下划线 'strikethrough', //删除线 'subscript', //下标 'fontborder', //字符边框 'superscript', //上标 'formatmatch', //格式刷 'source', //源代码 'blockquote', //引用 'pasteplain', //纯文本粘贴模式 'selectall', //全选 'print', //打印 'preview', //预览 'horizontal', //分隔线 'removeformat', //清除格式 'time', //时间 'date', //日期 'unlink', //取消链接 'insertrow', //前插入行 'insertcol', //前插入列 'mergeright', //右合并单元格 'mergedown', //下合并单元格 'deleterow', //删除行 'deletecol', //删除列 'splittorows', //拆分成行 'splittocols', //拆分成列 'splittocells', //完全拆分单元格 'deletecaption', //删除表格标题 'inserttitle', //插入标题 'mergecells', //合并多个单元格 'deletetable', //删除表格 'cleardoc', //清空文档 'insertparagraphbeforetable', //"表格前插入行" 'insertcode', //代码语言 'fontfamily', //字体 'fontsize', //字号 'paragraph', //段落格式 'simpleupload', //单图上传 'insertimage', //多图上传 'edittable', //表格属性 'edittd', //单元格属性 'link', //超链接 'emotion', //表情 'spechars', //特殊字符 'searchreplace', //查询替换 'map', //Baidu地图 'gmap', //Google地图 'insertvideo', //视频 'help', //帮助 'justifyleft', //居左对齐 'justifyright', //居右对齐 'justifycenter', //居中对齐 'justifyjustify', //两端对齐 'forecolor', //字体颜色 'backcolor', //背景色 'insertorderedlist', //有序列表 'insertunorderedlist', //无序列表 'fullscreen', //全屏 'directionalityltr', //从左向右输入 'directionalityrtl', //从右向左输入 'rowspacingtop', //段前距 'rowspacingbottom', //段后距 'pagebreak', //分页 'insertframe', //插入Iframe 'imagenone', //默认 'imageleft', //左浮动 'imageright', //右浮动 'attachment', //附件 'imagecenter', //居中 'wordimage', //图片转存 'lineheight', //行间距 'edittip ', //编辑提示 'customstyle', //自定义标题 'autotypeset', //自动排版 'webapp', //百度应用 'touppercase', //字母大写 'tolowercase', //字母小写 'background', //背景 'template', //模板 'scrawl', //涂鸦 'music', //音乐 'inserttable', //插入表格 'drafts', // 从草稿箱加载 'charts', // 图表 ] ]

 

转载于:https://www.cnblogs.com/LChenglong/p/8028874.html