增加 on-error 方法以及说明,修复导入普通文本文件失败的BUG,

This commit is contained in:
FungLeo 2020-05-08 11:15:31 +08:00
parent 220d760d7b
commit 01053791a0
3 changed files with 20 additions and 5 deletions

View File

@ -6,6 +6,7 @@
@on-copy="onCopy" @on-copy="onCopy"
@on-upload-image="onUpladImage" @on-upload-image="onUpladImage"
@on-save="onSave" @on-save="onSave"
@on-error="onError"
:height="500" :height="500"
/> />
</div> </div>
@ -38,6 +39,9 @@
}, },
onSave(data) { onSave(data) {
console.log(data); console.log(data);
},
onError(err) {
console.log(err)
} }
} }
} }

View File

@ -61,7 +61,7 @@ import { MarkdownPreview } from 'vue-meditor'
```js ```js
import Markdown from '@/components/markdown/...'; import Markdown from '@/components/markdown/...';
``` ```
专业版 专业版
```js ```js
import MarkdownPro from '@/components/markdown/pro'; import MarkdownPro from '@/components/markdown/pro';
``` ```
@ -80,7 +80,7 @@ import MarkdownPreview from '@/components/markdown/preview';
<script> <script>
import Markdown from 'vue-meditor'; import Markdown from 'vue-meditor';
export default { export default {
name: "markdown", name: "markdown",
components: { components: {
@ -253,13 +253,22 @@ marked配置项,与编辑器内该配置一致。
编辑器保存事件,自动保存或者手动保存时触发,支持`ctrl+s`或`command+s`触发保存,返回值类型为`Object`,包含当前输入值`value`和选择的代码块主题`theme`。 编辑器保存事件,自动保存或者手动保存时触发,支持`ctrl+s`或`command+s`触发保存,返回值类型为`Object`,包含当前输入值`value`和选择的代码块主题`theme`。
#### on-paste-image #### on-paste-image
监听编辑器粘贴图片事件,在编辑区域内手动粘贴图片时触发,可用于支持粘贴插入图片文件,返回`file`文件,上传文件后可结合`on-ready`事件内返回的`insertContent`插入图片。 监听编辑器粘贴图片事件,在编辑区域内手动粘贴图片时触发,可用于支持粘贴插入图片文件,返回`file`文件,上传文件后可结合`on-ready`事件内返回的`insertContent`插入图片。
#### on-copy #### on-copy
复制代码块内容触发时返回当前代码块的textcopyCode开启时才有效。 复制代码块内容触发时返回当前代码块的textcopyCode开启时才有效。
#### on-error
返回编辑器组件遇到的错误信息,交给业务代码进行错误处理。
code | message | 备注
--- | --- | ---
415 | Only text files can be imported | 导入文件仅支持文本格式
目前只有这一个错误信息。二次开发时,可根据自己的需要,在不同的地方返回不同的错误码以及错误信息。
## 二次开发 ## 二次开发
### 粘贴插入图片 ### 粘贴插入图片

View File

@ -130,7 +130,8 @@ export default {
return; return;
} }
const {type} = file; const {type} = file;
if (!['text/markdown', 'text/src'].includes(type)) { if (!(type === '' || /text\/\w+/.test(type))) {
this.$emit('on-error', { code: 415, message: 'Only text files can be imported' })
return; return;
} }
const reader = new FileReader(); const reader = new FileReader();
@ -139,6 +140,7 @@ export default {
}); });
reader.onload = () => { reader.onload = () => {
this.currentValue = reader.result; this.currentValue = reader.result;
console.log(typeof reader.result)
e.target.value = ''; e.target.value = '';
if (this.pro) {// 专业版手动set value if (this.pro) {// 专业版手动set value
this.editor.setOption('value', this.currentValue); this.editor.setOption('value', this.currentValue);