LightEditor

Props

v-model

• type: string
• default: ''

Html содержимое редактора

@model true

disabled

• type: boolean
• default: false

placeholder

• type: string
• default: ''

showBottomEmojiButton

• type: boolean
• default: true

Включить отображение кнопки для вставки эмодзи (в нижнем правом меню)

showBottomUploadImagesButton

• type: boolean
• default: false

Включить отображение кнопки для вставки картинок (в нижнем правом меню)
В shared, при переходе между страницами может не отображаться

imagesUploader

• type: FilesUploader
• default: defaultFilesUploader

Загрузчик картинок при включении пропа enableImages

По умолчанию превращает файлы в base64

toolbar

• type: EditorToolbar
• default: null

Содержимое тулбара над редактором

@example types

  | 'underline'
  | 'strike'
  | 'list'
  | 'header'
  | 'link'
  | 'image-custom'
  // | 'video'
  | 'clean';

export type ListType = 'ordered' | 'bullet';
// 4, 5, 6 закомментированы т.к. не хватает иконок
export type HeaderType = 1 | 2 | 3; // | 4 | 5 | 6;

export interface ConfigToolbarTypes {
  list: ListType;
  header: HeaderType;
}

export type ToolbarSimpleItem = ToolbarType;
export type ToolbarConfigItem = Partial<ConfigToolbarTypes>;
export type ToolbarPickerItem = Partial<{
  [K in keyof ConfigToolbarTypes]: Array<ConfigToolbarTypes[K]>;
}>;
export type ToolbarItem =
  | ToolbarSimpleItem
  | ToolbarConfigItem
  | ToolbarPickerItem;

@example usage

const toolbar: EditorToolbar = [
  ['bold', 'link', 'strike'],
  [{ list: 'bullet' }, { list: 'unordered' }],
  [{ list: ['bullet', 'unordered'] }],
  [{ header: [1, 2, 3, 4, 5, 6] }],
];

formats

• type: EditorFormat[]
• default: null

Доступные форматы (если к примеру отключить image, но оставить его в toolbar, он не добавится)

@example types

export type EditorFormat =
  | 'bold'
  | 'italic'
  | 'underline'
  | 'strike'
  | 'list'
  | 'header'
  | 'link'
  | 'image'

@example usage

const formats: EditorFormat[] = ['bold', 'image', 'strike']

Events

Slots

CSS Variables

--ql-editor-min-height — минимальная высота блока для редактирования