提交 9216bb56 编写于 作者: 璃白.'s avatar 璃白. 🌻

Update README.md

上级 8b579618
...@@ -8,19 +8,20 @@ ...@@ -8,19 +8,20 @@
2021-06-23 v0.4更新,添加功能: 2021-06-23 v0.4更新,添加功能:
- [onLoad事件] - throttle属性
- [onInput事件] - zIndex属性
- [throttle属性] - maxLength属性
- [zIndex属性] - showWordLimit属性
- [maxLength属性](#maxLength) - rows属性
- [showWordLimit属性](#showWordLimit) - filePathRule属性
- [rows属性](#rows) - [onLoad事件](#onload)
- [filePathRule属性](#filePathRule) - [onInput事件](#oninput)
- [setValue方法] - [setValue方法](#setvalue)
- [getValue方法] - [getValue方法](#getvalue)
- [focus方法] - [focus方法](#focus)
- [blur方法] - [blur方法](#blur)
- 移除footer,工具栏添加上传文件按钮 - **移除canAttachFile属性**
- **移除footer,工具栏添加上传文件按钮**
- 全屏模式添加工具栏 - 全屏模式添加工具栏
### v0.3 ### v0.3
...@@ -76,17 +77,16 @@ new MdEditor({ ...@@ -76,17 +77,16 @@ new MdEditor({
| maxLength | 最大字数限制 | String \| Number | 1000 | | | maxLength | 最大字数限制 | String \| Number | 1000 | |
| showWordLimit | 是否显示当前字数 | Boolean | false | | | showWordLimit | 是否显示当前字数 | Boolean | false | |
| rows | 编辑区行数 | String \| Number | 6 | 'auto' | | rows | 编辑区行数 | String \| Number | 6 | 'auto' |
| throttle | input事件的节流时间 | Number | 1000 | | | throttle | input事件的节流时间 | Number | 1000 | |
| filePathRule | 图片链接的格式限制 | RegExp | | | | filePathRule | 图片链接的格式限制 | RegExp | | |
| themeOptions | 主题颜色配置 | Object | [themeOptions](#themeoptions) | themeOptions | 主题颜色配置 | Object | [themeOptions](#themeoptions)
| toolsOptions | 顶部工具栏配置 | Object | [toolsOptions](#toolsoptions) | toolsOptions | 顶部工具栏配置 | Object | [toolsOptions](#toolsoptions)
| canAttachFile | 是否可以上传图片 | Boolean | true
| canPreview | 是否开启预览 | Boolean | true | canPreview | 是否开启预览 | Boolean | true
| placeholder | placeholder | String | "请输入内容" | placeholder | placeholder | String | "请输入内容"
| onLoad | 编辑器实例化 | Function | function(res) {} [示例](#onLoad) | onLoad | 编辑器实例化 | Function | function(res) {} [示例](#onload)
| onInput | 输入事件 | Function | function(res) {} [示例](#onInput) | onInput | 输入事件 | Function | function(res) {} [示例](#oninput)
| onFocus | 获取焦点事件 | Function | function(res) {} [示例](#onFocus) | onFocus | 获取焦点事件 | Function | function(res) {} [示例](#onfocus)
| onBlur | 失去焦点事件 | Function | function(res) {} [示例](#onBlur) | onBlur | 失去焦点事件 | Function | function(res) {} [示例](#onblur)
| onChange | 获取编辑器markdown及html内容 | Function | function(res) {} [示例](#onchange) | onChange | 获取编辑器markdown及html内容 | Function | function(res) {} [示例](#onchange)
| onUpload | 上传文件钩子函数 | Function | function(file, callback) {} [示例](#onupload) | onUpload | 上传文件钩子函数 | Function | function(file, callback) {} [示例](#onupload)
| onsubmit | 快捷键函数 | Function | function(file, callback) {} [示例](#onsubmit) | onsubmit | 快捷键函数 | Function | function(file, callback) {} [示例](#onsubmit)
...@@ -94,7 +94,7 @@ new MdEditor({ ...@@ -94,7 +94,7 @@ new MdEditor({
# 方法 # 方法
| 方法 | 说明 | 类型 | 示例 | | 方法 | 说明 | 类型 | 示例 |
| ------ | ------ | ------ | ------ | ------ | | ------ | ------ | ------ | ------ |
| focus | 使编辑器获取焦点 | Function | [focus](#focus) | | focus | 使编辑器获取焦点 | Function | [focus](#focus) |
| blur | 使编辑器失去焦点 | Function | [blur](#focus) | | blur | 使编辑器失去焦点 | Function | [blur](#focus) |
| getValue | 获取编辑器的内容 | Function | [getValue](#getvalue) | | getValue | 获取编辑器的内容 | Function | [getValue](#getvalue) |
...@@ -118,15 +118,29 @@ new MdEditor({ ...@@ -118,15 +118,29 @@ new MdEditor({
| bold | 加粗 | Boolean | true | bold | 加粗 | Boolean | true
| italic | 斜体 | Boolean | true | italic | 斜体 | Boolean | true
| quote | 引用 | Boolean | true | quote | 引用 | Boolean | true
| code | 代码 | Boolean | true | code | 代码 | Boolean | true
| link | 链接 | Boolean | true | link | 链接 | Boolean | true
| ul | 无序列表 | Boolean | true | ul | 无序列表 | Boolean | true
| ol | 有序列表 | Boolean | true | ol | 有序列表 | Boolean | true
| task | 任务列表 | Boolean | true | task | 任务列表 | Boolean | true
| table | 表格 | Boolean | true | table | 表格 | Boolean | true
| file | 上传文件 | Boolean | true
| fullScreen | 全屏模式 | Boolean | true | fullScreen | 全屏模式 | Boolean | true
# onLoad
编辑器实例化后触发
```js
new MdEditor({
...,
onLoad: function() {
console.log('ready') // { text: "...", html: "..." }
}
})
```
# onFocus # onFocus
编辑器获取焦点时触发 编辑器获取焦点时触发
...@@ -153,6 +167,19 @@ new MdEditor({ ...@@ -153,6 +167,19 @@ new MdEditor({
}) })
``` ```
# onInput
用于获取markdown内容及编译后的html内容
```js
new MdEditor({
...,
onInput: function(res) {
console.log(res) // { text: "...", html: "..." }
}
})
```
# onChange # onChange
用于获取markdown内容及编译后的html内容 用于获取markdown内容及编译后的html内容
...@@ -197,6 +224,65 @@ new MdEditor({ ...@@ -197,6 +224,65 @@ new MdEditor({
}) })
``` ```
# getValue
获取编辑器内容
```js
const myEditor = new MdEditor({
...
}
})
const value = myEditor.getValue()
console.log(value)
myEditor.getValue(value => {
console.log(value)
})
```
# setValue
设置编辑器内容
```js
const myEditor = new MdEditor({
...
}
})
myEditor.setValue('this is new content')
```
# focus
使编辑器获取焦点
```js
const myEditor = new MdEditor({
...
}
})
myEditor.focus()
```
# blur
使编辑器失去焦点
```js
const myEditor = new MdEditor({
...
}
})
myEditor.blur()
```
# Example # Example
```html ```html
<div id="app"></div> <div id="app"></div>
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册