富文本是我讨厌的工具之一,但是吧,讨厌啥来啥~~~
最近开始折腾tinymce,,,原本一切正常,直到图片上传,,,,贴代码了哦~
const editorObj = {
height: '400px',
language: 'zh_CN',
plugins: 'table lists link image preview code',
// 这个单引号要替换成模版字符串的那个斜引号哦!现在是写文章不好弄,就换成单引号
toolbar: ‘formatselect | code | preview | bold italic strikethrough forecolor backcolor |
link image | alignleft aligncenter alignright alignjustify |
numlist bullist outdent indent’,
relative_urls: false,
file_picker_types: 'image',
images_upload_url: 'aaa.aa', // 图片上传的接口地址
image_advtab: true,
image_uploadtab: true,
convert_urls: false,
paste_data_images: true,
images_upload_handler: (blobInfo, success, failure) => {
// 主要是这里哦~~~
const p = new Promise((resolve, reject) => {
resolve(`data:${blobInfo.blob().type};base64,${blobInfo.base64()}`)
})
return p
}
}
`
<Editor
inline={false}
selector="editorStateRef" // 选择器
apiKey="申请的key"
init={{ ...editorObj }}
onEditorChange={onValueChange}
/>
const onValueChange = (content, editor) => {
console.log(content)
}
下面这个是官网的示例,按照这个示例来写的,有问题的唉~~~真的是很崩溃了哦~~大家可以对比一下