layui编辑器（layedit）的实现和图片上传功能

官方文档入口：https://www.layui.com/doc/modules/layedit.html#uploadImage

先看效果图片：

开始上代码了 前端代码

<div class="layui-input-block">
    <textarea id="demo" style="display: none;"></textarea>
</div>

js代码

layui.use('layedit', function(){
    var layedit = layui.layedit;
    layedit.set({
        uploadImage: {  //上传图片的设置
            url: '{{route('admin_upload_layui_img')}}' //接口url
           ,type: 'post' //默认post
        }
    });
     layedit.build('demo');  //建立编辑器
});

php后台上传图片的接口

    /**
     *  layui上传图片 上传到本地服务器
     *  hinq 2020 03 03
     *
     */
    public function uploadLayuiImg()
    {
        if ($_FILES["file"]["error"] == 0) {
            //这里是上传图片处理代码 网上有跟多 我就不写注释了
            $fileUrl = 'upload/imgs';
            $dir = iconv("UTF-8", "GBK", $fileUrl);
            if (!file_exists($dir)) {
                mkdir($dir, 777, true);
            }
            $suffix = '.' . pathinfo($_FILES["file"]["name"], PATHINFO_EXTENSION);
            $picUrl = $fileUrl . '/' . self::GetRandStr() . $suffix;
            move_uploaded_file($_FILES["file"]["tmp_name"], $picUrl);

            //返回参数是官网规定的格式
            $data = [
                "code"=> 0 //0表示成功，其它失败
                ,"msg"=> "" //提示信息 //一般上传失败后返回
                ,"data"=> [
                    "src"=> $picUrl
                    ,"title"=> $_FILES["file"]["name"] //可选
                ]
            ];
            echo json_encode( $data );
        } else {
            echo json_encode(['code' => '1', 'url' => '']);
        }
    }

到这里layui编辑器（layedit） + 上传图片的功能就好了