奔三路 - 你30岁前的学习路!

奔三路学习网

当前位置: 主页 > vue面试通 > iview框架 >

iview-admin的富文本编辑器使用指南

时间:2017-12-05 18:32来源:未知 作者:admin
iview-admin的富文本编辑器是基于tinymce的。 在这个文件内容进行配置:src\views\my-components\text-editor\text-editor.vue。 具体的配置选项有: selector: textarea#elm1 , // textarea中为编辑区域 heme: moder
iview-admin的富文本编辑器是基于tinymce的。

在这个文件内容进行配置:src\views\my-components\text-editor\text-editor.vue。

具体的配置选项有:

selector:'textarea#elm1',          //<textarea>中为编辑区域

heme: "modern",                  //主题

language: "zh_cn",                //语言 ,可自行下载中文

plugins: [                             //插件,可自行根据现实内容删除

content_css: "css/content.css",      //引用的外部CSS样式,可删除

//定义工具栏的位置
theme_advanced_toolbar_location : "top",

//定义工具栏工具的对其方式
theme_advanced_toolbar_align : "left",

//定义输入框下方是否显示状态栏,默认不显示
theme_advanced_statusbar_location : "bottom",

//定义是否可以改变输入窗口大小
theme_advanced_resizing : true


插件对应列表如下:

//字体大小
font_size:['font_size','fontsizeselect'],

//加粗
bold:['bold_desc','Bold'],

//斜体
italic:['italic_desc','Italic'],

//下划线
underline:['underline_desc','Underline'],

//贯穿线
strikethrough:['striketrough_desc','Strikethrough'],

//左对齐
justifyleft:['justifyleft_desc','JustifyLeft'],

//居中对齐
justifycenter:['justifycenter_desc','JustifyCenter'],

//右对齐
justifyright:['justifyright_desc','JustifyRight'],

//两边对齐
justifyfull:['justifyfull_desc','JustifyFull'],

//项目符号列表
bullist:['bullist_desc','InsertUnorderedList'],

//编号列表
numlist:['numlist_desc','InsertOrderedList'],

//减少缩进
outdent:['outdent_desc','Outdent'],

//增加缩进
indent:['indent_desc','Indent'],

//剪切
cut:['cut_desc','Cut'],

//复制
copy:['copy_desc','Copy'],

//粘贴
paste:['paste_desc','Paste'],

//撤销
undo:['undo_desc','Undo'],

//重做
redo:['redo_desc','Redo'],

//增加链接
link:['link_desc','mceLink'],

//删除链接
unlink:['unlink_desc','unlink'],

//插入图片
image:['image_desc','mceImage'],

//清理代码
cleanup:['cleanup_desc','mceCleanup'],

//帮助
help:['help_desc','mceHelp'],

//代码视图
code:['code_desc','mceCodeEditor'],

//插入水平线
hr:['hr_desc','InsertHorizontalRule'],

//清除样式
removeformat:['removeformat_desc','RemoveFormat'],

//显示/隐藏对象
visualaid:['visualaid_desc','mceToggleVisualAid'],

//下标
sub:['sub_desc','sub.'],

//上标
sup:['sup_desc','super.'],

//插入特殊符号
charmap:['charmap_desc','mceCharMap'],

//字体颜色
forecolor:['forecolor_desc','ForeColor'],

//前景色
forecolorpicker:['forecolor_desc','mceForeColor'],

//背景色
backcolor:['backcolor_desc','HiliteColor'],

//背景色食色板
backcolorpicker:['backcolor_desc','mceBackColor'],

//插入编辑描点
anchor:['anchor_desc','mceInsertAnchor'],

//新建空白文档
newdocument:['newdocument_desc','mceNewDocument'],

//引用
blockquote:['blockquote_desc','mceBlockQuote'],

//查找替换
reply:['replace_desc','reply'],
(责任编辑:admin)
顶一下
(3)
23.1%
踩一下
(10)
76.9%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片
发布者资料
小邱 查看详细资料 发送留言 加为好友 用户等级:注册会员 注册时间:2017-11-26 17:11 最后登录:2018-06-11 16:06

关注奔三路