Laravel-使用富文字編輯器UEditor
阿新 • • 發佈:2019-01-10
安裝元件的方法如下:(當然需要你有composer)
- 直接命令列:或者在composer.json中的require中插入"stevenyangecho/laravel-u-editor": "^1.4"
- 執行composer install或者composer update。元件成功遷入後執行如下配置。
-
開啟框架下的config/app.php配置服務提供者
-
在providers下插入:Stevenyangecho\UEditor\UEditorServiceProvider::class,
-
儲存退出後在控制檯執行執行
-
php artisan vendor:publish
- 這一切成功後你的專案目錄下的config目錄下會生成一個UEditorUpload.php檔案,public目錄下會生成一個目錄laravel-u-editor。
UEditorUpload.php檔案是元件檔案上傳的一個配置檔案。裡面必須配置的有如下內容:
使用方法,如下程式碼: 這個是內容編輯頁面的檢視:// 'middleware' => 'auth', 'mode'=>'qiniu',//上傳方式,local 為本地 qiniu 為七牛 //七牛配置,若mode='qiniu',以下為必填. 'qiniu'=>[ 'accessKey'=>'accessKey', 'secretKey'=>'secretKey', 'bucket'=>'bucket', 'url'=>'url',//七牛分配的CDN域名,注意帶上http://
這裡引入js指令碼:<div class="col-sm-10"> @include('vendor.UEditor.head') <!-- 載入編輯器的容器 --> <script id="container" name="content" type="text/plain" style='width:100%;height:300px;'> {!! html_entity_decode($article->content) !!} </script> <!-- 例項化編輯器 --> <script type="text/javascript"> var ue = UE.getEditor('container'); ue.ready(function(){ ue.execCommand('serverparam', '_token', '{{ csrf_token() }}'); }); </script> </div>
@include('vendor.UEditor.head')
內容新增頁面去掉 :
{!! html_entity_decode($article->content) !!}
這裡定義編輯器介面高寬:
style='width:100%;height:300px;'
這裡例項化編輯器:
var ue = UE.getEditor('container');
這裡新增laravel安全token:
ue.execCommand('serverparam', '_token', '{{ csrf_token() }}');