如何在vue項(xiàng)目中使用UEditor--plus
1:UEditor-plus富文本編輯器如何在vue項(xiàng)目中使用
備注：UEditor是由百度web前端研發(fā)部開發(fā)的所見即所得的開源富文本編輯器，由于該項(xiàng)目不在維護(hù)；程序員自發(fā)對(duì)其進(jìn)行了維護(hù)，詳見
https://gitee.com/modstart-lib/ueditor-plus?_from=gitee_search；
2.使用方法
第一步：在git上拉取ueditor代碼到本地
第二步：解壓后找到dist文件夾，復(fù)制并粘貼到vue項(xiàng)目包中的static（vue3粘貼到public）文件夾目錄下，并改名為UEditor
第三步：在頁(yè)面中引入U(xiǎn)EditorPlus富文本編輯器
第四步：在頁(yè)面中插入組件
<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>第五步：配置項(xiàng)
data(){
return {
content: '<p>Hello UEditorPlus</p>',
editorConfig: {
serverUrl: '后端服務(wù)',
// 配置UEditorPlus的驚天資源
UEDITOR_HOME_URL: '/static/UEditorPlus/'
},
}
}3.運(yùn)行項(xiàng)目
注：由于配置項(xiàng)未配置，需要與后端小伙伴聯(lián)調(diào)，才可使用上傳功能
到此這篇關(guān)于如何在vue項(xiàng)目中使用UEditor--plus的文章就介紹到這了,更多相關(guān)vueUEditor--plus內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
Vue中使用localStorage存儲(chǔ)token并設(shè)置時(shí)效
這篇文章主要為大家介紹了Vue中使用localStorage存儲(chǔ)token并設(shè)置時(shí)效，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-06-06
Vue中this.$nextTick()方法的使用及代碼示例
$nextTick()是Vue.js框架中的一個(gè)方法，它主要用于DOM操作，當(dāng)我們修改Vue組件中的數(shù)據(jù)時(shí)，Vue.js會(huì)在下次事件循環(huán)前自動(dòng)更新視圖，并異步執(zhí)行$nextTick()中的回調(diào)函數(shù)，本文主要介紹了Vue中this.$nextTick()方法的使用及代碼示例,需要的朋友可以參考下2023-05-05
Vue?提供了雙向數(shù)據(jù)綁定機(jī)制,使得開發(fā)者可以輕松地將表單組件的值與?Vue?實(shí)例中的數(shù)據(jù)進(jìn)行關(guān)聯(lián),本文將詳細(xì)介紹如何在?Vue?中使用這些表單組件,并實(shí)現(xiàn)雙向數(shù)據(jù)綁定,需要的可以參考下2024-03-03
這篇文章主要介紹了Vue入口文件index.html緩存的問題及解決方案，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-03-03
Vue 動(dòng)態(tài)添加路由及生成菜單的方法示例
這篇文章主要介紹了Vue 動(dòng)態(tài)添加路由及生成菜單的方法示例，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-06-06
Vue+Element UI 實(shí)現(xiàn)視頻上傳功能
這篇文章主要介紹了Vue+Element UI 實(shí)現(xiàn)視頻上傳功能,前臺(tái)使用Vue+Element UI中的el-upload組件實(shí)現(xiàn)視頻上傳及進(jìn)度條展示，后臺(tái)提供視頻上傳API并返回URL，具體實(shí)現(xiàn)代碼及效果展示跟隨小編一起看看吧2022-01-01
vue獲取DOM元素并設(shè)置屬性的兩種實(shí)現(xiàn)方法
下面小編就為大家?guī)硪黄獀ue獲取DOM元素并設(shè)置屬性的兩種實(shí)現(xiàn)方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-09-09
vue3的setup語(yǔ)法糖簡(jiǎn)單封裝ckediter的過程
Vue3官方提供了 script setup 語(yǔ)法糖,只需在script標(biāo)簽中添加setup,組件只需引入不用注冊(cè),屬性和方法也不用返回,今天通過本文給大家分享vue3的setup語(yǔ)法糖簡(jiǎn)單封裝ckediter的過程,感興趣的朋友一起看看吧2023-10-10
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)全選、反選功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-06-06
vue關(guān)于接口請(qǐng)求數(shù)據(jù)過大導(dǎo)致瀏覽器崩潰的問題
這篇文章主要介紹了vue關(guān)于接口請(qǐng)求數(shù)據(jù)過大導(dǎo)致瀏覽器崩潰的問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-08-08