vue3使用kindeditor富文本編輯器組件,支持上傳圖片(接口或base64)
參考文章:https://blog.csdn.net/qq_27936291/article/details/124768989
1.安裝插件
npm i @zhj-target/vue3-kind-editor --save
或者
yarn add @zhj-target/vue3-kind-editor
2.在vue項目中使用
import Vue3KindEditor from '@zhj-target/vue3-kind-editor' const state = reactive({ editorText: '' }) <!-- v-model已是雙向綁定了 --> <vue3-kind-editor id="editor_id" height="500px" width="100%" v-model="state.editorText" :loadStyleMode="false"></vue3-kind-editor>
3.上傳圖片默認上傳方式是base64,如果要支持接口上傳需要修改文件:kindeditor-all.js 以及組件傳參:uploadJson、filePostName
<vue3-kind-editor id="editor_id" height="500px" width="100%" v-model="state.editorText" :loadStyleMode="false" :uploadJson="/dev-api/web/file/upload" filePostName="file"></vue3-kind-editor>

4.效果展示:


浙公網安備 33010602011771號