如何在vue項目中使用UEditor--plus
1:UEditor-plus富文本編輯器如何在vue項目中使用
備注:UEditor是由百度web前端研發(fā)部開發(fā)的所見即所得的開源富文本編輯器,由于該項目不在維護(hù);程序員自發(fā)對其進(jìn)行了維護(hù),詳見
https://gitee.com/modstart-lib/ueditor-plus?_from=gitee_search;
2.使用方法
第一步:在git上拉取ueditor代碼到本地
第二步:解壓后找到dist文件夾,復(fù)制并粘貼到vue項目包中的static(vue3粘貼到public)文件夾目錄下,并改名為UEditor
第三步:在頁面中引入UEditorPlus富文本編輯器
第四步:在頁面中插入組件
<div class="content"> <vue-ueditor-wrap v-model="content" editor-id="editor" :config="editorConfig" :editorDependencies="['ueditor.config.js','ueditor.all.js']" style="height:500px;" /> </div>
第五步:配置項
data(){ return { content: '<p>Hello UEditorPlus</p>', editorConfig: { serverUrl: '后端服務(wù)', // 配置UEditorPlus的驚天資源 UEDITOR_HOME_URL: '/static/UEditorPlus/' }, } }
3.運(yùn)行項目
注:由于配置項未配置,需要與后端小伙伴聯(lián)調(diào),才可使用上傳功能
到此這篇關(guān)于如何在vue項目中使用UEditor--plus的文章就介紹到這了,更多相關(guān)vueUEditor--plus內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Vue中使用localStorage存儲token并設(shè)置時效
這篇文章主要為大家介紹了Vue中使用localStorage存儲token并設(shè)置時效,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-06-06Vue中this.$nextTick()方法的使用及代碼示例
$nextTick()是Vue.js框架中的一個方法,它主要用于DOM操作,當(dāng)我們修改Vue組件中的數(shù)據(jù)時,Vue.js會在下次事件循環(huán)前自動更新視圖,并異步執(zhí)行$nextTick()中的回調(diào)函數(shù),本文主要介紹了Vue中this.$nextTick()方法的使用及代碼示例,需要的朋友可以參考下2023-05-05vue獲取DOM元素并設(shè)置屬性的兩種實現(xiàn)方法
下面小編就為大家?guī)硪黄獀ue獲取DOM元素并設(shè)置屬性的兩種實現(xiàn)方法。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-09-09vue關(guān)于接口請求數(shù)據(jù)過大導(dǎo)致瀏覽器崩潰的問題
這篇文章主要介紹了vue關(guān)于接口請求數(shù)據(jù)過大導(dǎo)致瀏覽器崩潰的問題,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-08-08