# CKEditor
CKEditor (opens new window) 组件基于 CKEditor 5 封装,是一款 富文本编辑器;CKEditor 官网 (opens new window)。
# Props
| 名称 | 类型 | 默认值 | 说明 | 
|---|---|---|---|
| value | String | 编辑器的内容. | |
| toolbars | string[] | CKEditorConfig.toolbar |  编辑器 工具栏 配置. | 
| onChange | Function(data: string, editor: any, event: any) | ||
| onFocus | Function(event: any, editor: any) | ||
| onBlur | Function(event: any, editor: any) | ||
| onReady | Function(editor: any) | 
export const CKEditorConfig = {
  toolbar: [
    'heading',
    '|',
    'fontfamily',
    'fontsize',
    'fontColor',
    'fontBackgroundColor',
    '|',
    'bold',
    'italic',
    'underline',
    'strikethrough',
    '|',
    'alignment',
    '|',
    'numberedList',
    'bulletedList',
    '|',
    'indent',
    'outdent',
    '|',
    'link',
    'blockquote',
    'imageUpload',
    'insertTable',
    'mediaEmbed',
    '|',
    'undo',
    'redo',
  ],
};
 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
# Example
# 卸载
如果你不需要此组件,然后代码打包感觉不需要,可以卸载此组件。
1、CMD 运行
npm uninstall @ckeditor/ckeditor5-build-decoupled-document
npm uninstall @ckeditor/ckeditor5-react
 1
2
2
2、删除组件文件目录 @/components/CKEditor (opens new window)
← tui-editor IconSvg →