首页 > 其他 > 详细

laravel-admin集成ueditor百度编辑器

时间:2019-02-18 18:41:20      阅读:263      评论:0      收藏:0      [点我收藏+]
laravel-admin集成ueditor百度编辑器
什么是ueditor
ueditor是百度开源的一款编辑器,其中它的源代码模式真的是非常实用的,能让你更大限度的定制你的内容。
什么是laravle-admin
Laravle-admin是基于laravle的一个后台管理包,但其默认编辑器是ckeditor,个人不太喜欢,所以就把它换成ueditor
安装步骤

  1. 执行命令如下命令下载安装插件
    composer require "overtrue/laravel-ueditor:~1.0"
  2. 发布配置
    php artisan vendor:publish --provider=‘Overtrue\LaravelUEditor\UEditorServiceProvider‘
  3. 增加laravel-admin组件文件
    增加组件文件:app/Admin/Extensions/Form/uEditor.php:
    
    <?php

namespace App\Admin\Extensions\Form;
use Encore\Admin\Form\Field;

/**

  • 百度编辑器
  • Class uEditor
  • @package App\Admin\Extensions\Form
    */
    class uEditor extends Field
    {
    // 定义视图
    protected $view = ‘admin.uEditor‘;

    // css资源
    protected static $css = [];

    // js资源
    protected static $js = [];

    public function render()
    {
    $this->script = <<<EOT
    //解决第二次进入加载不出来的问题
    UE.delEditor("ueditor");
    // 默认id是ueditor
    var ue = UE.getEditor(‘ueditor‘, {
    // 自定义工具栏
    toolbars: [
    [‘bold‘, ‘italic‘, ‘underline‘, ‘strikethrough‘, ‘blockquote‘, ‘insertunorderedlist‘, ‘insertorderedlist‘, ‘justifyleft‘, ‘justifycenter‘, ‘justifyright‘, ‘link‘, ‘insertimage‘, ‘source‘, ‘fullscreen‘]
    ],
    elementPathEnabled: false,
    enableContextMenu: false,
    autoClearEmptyNode: true,
    wordCount: false,
    imagePopup: false,
    autotypeset: {indent: true, imageBlockLine: ‘center‘}
    });
    ue.ready(function () {
    ue.execCommand(‘serverparam‘, ‘_token‘, ‘{{ csrf_token() }}‘);
    });

EOT;
return parent::render();
}
}

4.增加视图文件: resources/views/admin/uEditor.blade.php

@include(‘vendor.ueditor.assets‘)
<div class="form-group {!! !$errors->has($errorKey) ?: ‘has-error‘ !!}">
<label for="{{$id}}" class="col-sm-2 control-label">{{$label}}</label>
<div class="col-sm-8">br/>@include(‘admin::form.error‘)
{{-- 这个style可以限制他的高度,不会随着内容变长 --}}
<textarea type=‘text/plain‘ style="height:400px;" id=‘ueditor‘ id="{{$id}}" name="{{$name}}" placeholder="{{ $placeholder }}" {!! $attributes !!} class=‘ueditor‘>
{!! old($column, $value) !!}
br/>@include(‘admin::form.help-block‘)
</div>
</div>

5. 然后注册进laravel-admin,在app/Admin/bootstrap.php中添加以下代码

use App\Admin\Extensions\Form\uEditor;
use Encore\Admin\Form;

Form::extend(‘ueditor‘, uEditor::class);


6. 调用
$form->ueditor(‘content‘, ‘内容‘)->rules(‘required‘);;

laravel-admin集成ueditor百度编辑器

原文:http://blog.51cto.com/14205520/2351336

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!