已开启
custom-image 增加 allowInvalid 用于支持特定场景需要返回原始url #1
摔倒的红烧肉创建于 2025年8月15日
custom-image 增加 allowInvalid 用于支持特定场景需要返回原始url #1
已开启
共 4 个文件变更+22-7
| @@ -27,6 +27,10 @@ export class BlotFormatter { | |||
| 27 | 27 | ||
| 28 | constructor(public quill: FluentEditor, options: Partial<BlotFormatterOptions> = {}) { | 28 | constructor(public quill: FluentEditor, options: Partial<BlotFormatterOptions> = {}) { |
| 29 | this.options = deepmerge({}, DefaultOptions, options, { arrayMerge: dontMerge }) | 29 | this.options = deepmerge({}, DefaultOptions, options, { arrayMerge: dontMerge }) |
| 30 | + if (options.allowInvalidUrl !== undefined) { | ||
| 31 | + this.options.allowInvalidUrl = options.allowInvalidUrl | ||
| 32 | + } | ||
| 33 | + CustomImage.setOptions(this.options.allowInvalidUrl) | ||
| 30 | this.currentSpec = null | 34 | this.currentSpec = null |
| 31 | this.actions = [] | 35 | this.actions = [] |
| 32 | this.overlay = document.createElement('div') | 36 | this.overlay = document.createElement('div') |
| @@ -18,7 +18,13 @@ export class CustomImage extends Embed { | |||
| 18 | static blotName = 'image' | 18 | static blotName = 'image' |
| 19 | static tagName = 'IMG' | 19 | static tagName = 'IMG' |
| 20 | static ID_SEED = 0 | 20 | static ID_SEED = 0 |
| 21 | + static allowInvalidUrl: boolean = false | ||
| 21 | declare domNode: HTMLElement | 22 | declare domNode: HTMLElement |
| 23 | + | ||
| 24 | + static setOptions(allowInvalidUrl: boolean) { | ||
| 25 | + this.allowInvalidUrl = allowInvalidUrl | ||
| 26 | + } | ||
| 27 | + | ||
| 22 | static create(value: ImageValue) { | 28 | static create(value: ImageValue) { |
| 23 | const node = super.create(value) as HTMLElement | 29 | const node = super.create(value) as HTMLElement |
| 24 | const url = typeof value === 'string' ? value : value.src | 30 | const url = typeof value === 'string' ? value : value.src |
| @@ -69,7 +75,7 @@ export class CustomImage extends Embed { | |||
| 69 | } | 75 | } |
| 70 | 76 | ||
| 71 | static sanitize(url: string) { | 77 | static sanitize(url: string) { |
| 72 | - return sanitize(url, ['http', 'https', 'blob', 'data']) ? url : '//:0' | 78 | + return sanitize(url, ['http', 'https', 'blob', 'data']) ? url : (this.allowInvalidUrl ? url : '//:0') |
| 73 | } | 79 | } |
| 74 | 80 | ||
| 75 | static value(domNode: HTMLElement) { | 81 | static value(domNode: HTMLElement) { |
| @@ -54,6 +54,7 @@ export interface BlotFormatterOptions { | |||
| 54 | overlay: OverlayOptions | 54 | overlay: OverlayOptions |
| 55 | resize: ResizeOptions | 55 | resize: ResizeOptions |
| 56 | toolbar: ToolbarOptions | 56 | toolbar: ToolbarOptions |
| 57 | + allowInvalidUrl: boolean | ||
| 57 | } | 58 | } |
| 58 | 59 | ||
| 59 | export const LEFT_ALIGN = 'align-left' | 60 | export const LEFT_ALIGN = 'align-left' |
| @@ -62,6 +63,7 @@ export const RIGHT_ALIGN = 'align-right' | |||
| 62 | export const COPY = 'copy' | 63 | export const COPY = 'copy' |
| 63 | export const DOWNLOAD = 'download' | 64 | export const DOWNLOAD = 'download' |
| 64 | const DefaultOptions: BlotFormatterOptions = { | 65 | const DefaultOptions: BlotFormatterOptions = { |
| 66 | + allowInvalidUrl: false, | ||
| 65 | specs: [ | 67 | specs: [ |
| 66 | ImageSpec, | 68 | ImageSpec, |
| 67 | ], | 69 | ], |
| @@ -45,6 +45,9 @@ onMounted(() => { | |||
| 45 | editor = new FluentEditor('#editor', { | 45 | editor = new FluentEditor('#editor', { |
| 46 | theme: 'snow', | 46 | theme: 'snow', |
| 47 | modules: { | 47 | modules: { |
| 48 | + 'image': { | ||
| 49 | + allowInvalidUrl: true, | ||
| 50 | + }, | ||
| 48 | 'toolbar': { | 51 | 'toolbar': { |
| 49 | container: TOOLBAR_CONFIG, | 52 | container: TOOLBAR_CONFIG, |
| 50 | handlers: { | 53 | handlers: { |
| @@ -57,12 +60,12 @@ onMounted(() => { | |||
| 57 | }, | 60 | }, |
| 58 | 'table-up': { | 61 | 'table-up': { |
| 59 | customSelect: defaultCustomSelect, | 62 | customSelect: defaultCustomSelect, |
| 60 | - selection: TableSelection, | 63 | + modules: [ |
| 61 | - selectionOptions: { | 64 | + { module: TableResizeLine }, |
| 62 | - tableMenu: TableMenuContextmenu, | 65 | + { module: TableResizeScale }, |
| 63 | - }, | 66 | + { module: TableSelection }, |
| 64 | - resize: TableResizeLine, | 67 | + { module: TableMenuContextmenu }, |
| 65 | - resizeScale: TableResizeScale, | 68 | + ], |
| 66 | }, | 69 | }, |
| 67 | 'shortcut-key': { | 70 | 'shortcut-key': { |
| 68 | menuItems: [tableUpConfig], | 71 | menuItems: [tableUpConfig], |