laravel框架集成Ueditor編輯器


近日開發中要在laravel框架中集成富文本編輯器,方便運營同事使用。原來使用TP框架的思路就是把JS文件整合到框架中,然后前端注入,后端交互。在laravel中的思路也應該差不多。下面將laravel集成Ueditor的方法和心得記錄如下:

1.   laravel的依賴管理工具composer中可以快速的幫助我們集成ueditor到框架中,配置過程:

配置composer.json文件,在require中寫入:

"stevenyangecho/laravel-u-editor": "~1.4"

然后在cmd模式下輸入:composer update (需要將composer配置為全局變量)

更新完成之后,修改laravel的配置文件(config/app.php):

在 "providers" 這個key 最后加上 :

Stevenyangecho\UEditor\UEditorServiceProvider::class

在"aliases" 這個key最后加上:

'UEditor'=>Stevenyangecho\UEditor\UEditorServiceProvider::class

OK,配置完成之后進入laravel項目的根目錄下輸入:

php artisan vendor:publish

一串文件下載配置之后,laravel項目的public目錄下會自動建立一個laravel-u-editor的文件夾。這個文件夾里包含的是編輯器本身的JS文件。同時在config文件夾下也會生成一個名為UEditorUpload.php的文件,這個是基礎的配置文件。當這些文件都生成之后,說明編輯器已經在項目中集成好了,下一步就可以在視圖文件中進行注入了

2.   前端視圖中整合ue編輯器:

首先引入JS等文件,因為laravel框架已經幫我們集成好了,直接在視圖文件尾部加入

@include('UEditor::head') 即可

 然后加載編輯器的容器,最后實例化編輯器,這部分比較簡單,直接貼代碼:

<!-- 加載編輯器的容器 -->

<div id="detail_info">
<script id="container" name="content" type="text/plain" style="width: 900px;position:absolute;left:300px;top:120px;">
</script>

<!-- 實例化編輯器 -->

<script>

var ue = UE.getEditor('container');

</script>

 

好了,到此為止大功告成。另外有關於百度富文本編輯器的問題,請移步官方api文檔尋找答案。有疑問的話可以評論或者私信我,大家一起研究解決~~~~

 




免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM