Editor - 富文本组件
概述
wangEditor的Vue运用,做了一点点的简化
代码示例
以base64方式处理上传的图片
<Editor base64 v-model="value1" :height="800"></Editor>
import { Editor } from 'idiew'
export default {
components: { Editor },
data () {
return {
value1: ''
}
}
}
将图片上传到服务器
<Editor :header="uploadConfig.header" :action="uploadConfig.action" :url="uploadConfig.url" v-model="value2" :height="800"></Editor>
import { Editor } from 'idiew'
export default {
data () {
return {
value2: '',
uploadConfig: {
header: {
'Authorization': 'Bearer ...'
},
action: '/api/file/upload',
url: '/api/file/',
}
}
}
}
参数表格
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
value | 绑定的内容,可使用v-model 双向绑定 |
String |
- |
height | 编辑区域的高度,单位为px |
Number |
600 |
id | 组件id,多个富文本组件时使用 | String |
idiew-editor |
base64 | 采用base64方式处理图片上传 | Boolean |
false |
header | 图片上传至服务器时的header | Object |
{} |
action | 图片上传至服务器时的action | String |
- |
url | 上传成功后,插入图片id前的url地址 | String |
- |