diff --git a/CHANGELOG.md b/CHANGELOG.md index 97e7a782e..416fbd83a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -68,10 +68,12 @@ ### v3.3.11 / 2020-07-xx +* [614](/~https://github.com/Vanessa219/vditor/issues/614) 添加 linkToImgUrl 回调 `引入特性` * [617](/~https://github.com/Vanessa219/vditor/issues/617) options.preview.theme.current 需设置不使用主题样式 `改进功能` * [611](/~https://github.com/Vanessa219/vditor/issues/611) SV 模式粘贴图片拉取上传问题 `修复缺陷` * [616](/~https://github.com/Vanessa219/vditor/pull/616) fix: safari下选中文字添加标题文字会消失 `修复缺陷` * [615](/~https://github.com/Vanessa219/vditor/issues/615) 即时渲染模式下在safari中光标位置跳动 `修复缺陷` +* 添加 `options.upload.linkToImgCallback` ### v3.3.10 / 2020-07-20 diff --git a/README.md b/README.md index 8bb5fe4d2..b4a3de831 100644 --- a/README.md +++ b/README.md @@ -200,12 +200,12 @@ Markdown 输出的 HTML 所展现的外观。内置 light,dark,wechat 3 套 | width | 编辑器总宽度,支持 % | 'auto' | | placeholder | 输入区域为空时的提示 | '' | | lang | 多语言:en_US, ko_KR, zh_CN | 'zh_CN' | -| input | 输入后触发 (value: string, previewElement?: HTMLElement): void | - | -| focus | 聚焦后触发 (value: string): void | - | -| blur | 失焦后触发 (value: string): void | - | -| esc | esc 按下后触发 (value: string): void | - | -| ctrlEnter | ⌘/ctrl+enter 按下后触发 (value: string): void | - | -| select | 编辑器中选中文字后触发 (value: string): void | - | +| input(value: string, previewElement?: HTMLElement): void | 输入后触发 | - | +| focus(value: string): void | 聚焦后触发 | - | +| blur(value: string): void | 失焦后触发 | - | +| esc(value: string): void | esc 按下后触发 | - | +| ctrlEnter(value: string): void | ⌘/ctrl+enter 按下后触发 | - | +| select(value: string): void | 编辑器中选中文字后触发 | - | | tab | tab 键操作字符串,支持 `\t` 及任意字符串 | - | | typewriterMode | 是否启用打字机模式 | false | | cdn | 配置自建 CDN 地址 | `https://cdn.jsdelivr.net/npm/vditor@${VDITOR_VERSION}` | @@ -245,7 +245,7 @@ new Vditor('vditor', { | hotkey | 快捷键,格式为⌘/ctrl-key⌘/ctrl-⇧/shift-key | - | | suffix | 插入编辑器中的后缀 | - | | prefix | 插入编辑器中的前缀 | - | -| click | 自定义按钮点击时触发的事件 (): void | - | +| click(): void | 自定义按钮点击时触发的事件 | - | | className | 样式名 | '' | | toolbar?: Array | 子菜单 | - | @@ -270,7 +270,7 @@ new Vditor('vditor', { | - | - | - | | enable | 是否使用 localStorage 进行缓存 | true | | id | 缓存 key,第一个参数为元素且启用缓存时**必填** | - | -| after | 缓存后的回调 (html: string): string | - | +| after(html: string): string | 缓存后的回调 | - | #### options.preview @@ -280,8 +280,8 @@ new Vditor('vditor', { | maxWidth | 预览区域最大宽度 | 800 | | mode | 显示模式:both, editor | 'both' | | url | md 解析请求 | - | -| parse | 预览回调 (element: HTMLElement): void | - | -| transform | 渲染之前回调 (html: string): string | - | +| parse(element: HTMLElement): void | 预览回调 | - | +| transform(html: string): string | 渲染之前回调 | - | #### options.preview.hljs @@ -333,7 +333,7 @@ new Vditor('vditor', { | key | 按钮唯一标识,不能为空 | - | | text | 按钮文字 | - | | className | 按钮类名 | - | -| click: (key: string) => void; | 按钮点击回调事件 | - | +| click(key: string) => void | 按钮点击回调事件 | - | #### options.hint @@ -343,7 +343,7 @@ new Vditor('vditor', { | emoji | 默认表情,可从[lute/emoji_map](/~https://github.com/88250/lute/blob/master/parse/emoji_map.go) 中选取,也可自定义 | { '+1': '👍', '-1': '👎', 'heart': '❤️', 'cold_sweat': '😰' } | | emojiTail | 常用表情提示 | - | | emojiPath | 表情图片地址 | `https://cdn.jsdelivr.net/npm/vditor@${VDITOR_VERSION}/dist/images/emoji` | -| at | @用户回调 (value: string): Array\,需同步返回数组 [{value: '', html: ''}] | - | +| at(value: string): Array\ | @用户回调,需同步返回数组 [{value: '', html: ''}] | - | #### options.upload @@ -409,19 +409,20 @@ if (xhr.status === 200) { | url | 上传 url | '' | | max | 上传文件最大 Byte | 10 * 1024 * 1024 | | linkToImgUrl | 剪切板中包含图片地址时,使用此 url 重新上传 | '' | -| success | 上传成功回调 (editor: HTMLPreElement, msg: string): void | - | -| error | 上传失败回调 (msg: string): void | - | +| linkToImgCallback(responseText: string): void | 图片地址时上传回调 | - | +| success(editor: HTMLPreElement, msg: string): void | 上传成功回调 | - | +| error(msg: string): void | 上传失败回调 | - | | token | CORS 上传验证,头为 X-Upload-Token | - | | withCredentials | 跨站点访问控制 | false | | headers | 请求头设置 | - | -| filename | 文件名安全处理 (name: string): string \| name => name.replace(/\W/g, '') | | +| filename(name: string): string | 文件名安全处理 | name => name.replace(/\W/g, '') | | accept | 文件上传类型,同[input accept](https://www.w3schools.com/tags/att_input_accept.asp) | - | -| validate | 校验,成功时返回 true 否则返回错误信息 (files: File[]) => string \| boolean | - | -| handler | 自定义上传,当发生错误时返回错误信息 (files: File[]) => string \| null | - | -| format | 对服务端返回的数据进行转换,以满足内置的数据结构 (files: File[], responseText: string): string | - | -| file | 将上传的文件处理后再返回 (files: File[]): File[] | - | -| setHeaders | 上传前使用返回值设置头 (): { [key: string]: string } | - | -| extraData | 为 FormData 添加额外的参数 { [key: string]: string \| Blob } | - | +| validate(files: File[]) => string \| boolean | 校验,成功时返回 true 否则返回错误信息 | - | +| handler(files: File[]) => string \| null | 自定义上传,当发生错误时返回错误信息 | - | +| format(files: File[], responseText: string): string | 对服务端返回的数据进行转换,以满足内置的数据结构 | - | +| file(files: File[]): File[] | 将上传的文件处理后再返回 | - | +| setHeaders(): { [key: string]: string } | 上传前使用返回值设置头 | - | +| extraData: { [key: string]: string \| Blob } | 为 FormData 添加额外的参数 | - | | multiple | 上传文件是否为多个 | true | | fieldName | 上传字段名称 | 'file[]' | @@ -431,7 +432,7 @@ if (xhr.status === 200) { | - | - | - | | enable | 是否支持大小拖拽 | false | | position | 拖拽栏位置:top, bottom | 'bottom' | -| after | 拖拽结束的回调 (height: number): void | - | +| after(height: number): void | 拖拽结束的回调 | - | #### options.classes @@ -524,8 +525,8 @@ options?: IPreviewOptions { | graphvizRender(element: HTMLElement, cdn?: string) | 对 graphviz 进行渲染 | | outlineRender(contentElement: HTMLElement, targetElement: Element) | 对大纲进行渲染 | | lazyLoadImageRender(element: (HTMLElement \| Document) = document) | 对启用懒加载的图片进行渲染 | -| setCodeTheme (codeTheme: string, cdn = options.cdn) | 设置代码主题,codeTheme 参见 options.preview.hljs.style | -| setContentTheme (contentTheme: string, path: string) | 设置内容主题,contentTheme 参见 options.preview.theme.list | +| setCodeTheme(codeTheme: string, cdn = options.cdn) | 设置代码主题,codeTheme 参见 options.preview.hljs.style | +| setContentTheme(contentTheme: string, path: string) | 设置内容主题,contentTheme 参见 options.preview.theme.list | ## 🏗 开发文档 diff --git a/README_en_US.md b/README_en_US.md index bbae23a7e..058d84e15 100644 --- a/README_en_US.md +++ b/README_en_US.md @@ -362,6 +362,7 @@ xhr.send(JSON.stringify({url: src})); // src is the address of the image outside | url | Upload url | '' | | max | The largest upload file Byte | 10 * 1024 * 1024 | | linkToImgUrl | When the clipboard contains the image address, use this url to re-upload | '' | +| linkToImgCallback | Callback when uploading picture address | - | | success | Upload success callback (editor: HTMLPreElement, msg: string): void | - | | error | Upload failure callback (msg: string): void | - | | token | CORS upload verification, header is X-Upload-Token | - | diff --git a/src/ts/util/fixBrowserBehavior.ts b/src/ts/util/fixBrowserBehavior.ts index 625bed3ad..fa17ad75c 100644 --- a/src/ts/util/fixBrowserBehavior.ts +++ b/src/ts/util/fixBrowserBehavior.ts @@ -1234,6 +1234,9 @@ export const paste = (vditor: IVditor, event: ClipboardEvent & { target: HTMLEle } else { vditor.tip.show(xhr.responseText); } + if (vditor.options.upload.linkToImgCallback) { + vditor.options.upload.linkToImgCallback(xhr.responseText); + } } }; xhr.send(JSON.stringify({url: src})); diff --git a/types/index.d.ts b/types/index.d.ts index fe4d9c1cb..1df45dfb1 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -275,6 +275,9 @@ interface IUpload { /** 将上传的文件处理后再返回 */ file?(files: File[]): File[]; + + /** 图片地址上传后的回调 */ + linkToImgCallback?(responseText: string): void; } /** @link https://hacpai.com/article/1549638745630#options-toolbar */