layui 富文本编辑器

html部分

<textarea id="demo" lay-verify="content" name="explain" class="layui-textarea">{$list.explain}</textarea>

js部分

 layui.use(["jquery", "form", "layedit"], function () {
 	var $ = layui.jquery
 	,upload = layui.upload
 	,layedit = layui.layedit
 	,form = layui.form;
 	//注意：layedit.set 一定要放在 build 前面，否则配置全局接口将无效。
    layedit.set({
        uploadImage: {
            url: '/admin/Upload/up' //图片上传接口
            ,type: 'post' //默认post
        }
    });
    var index = layedit.build('demo'); //建立编辑器
    //提交时把值同步到文本域中
    form.verify({
        //content富文本域中的lay-verify值
        content: function (value) {
            return layedit.sync(index);
        }
    });
})

注意：
图片上传接口返回信息的格式必须如下所示，否则将显示不出来图片

{
  "code": 0 //0表示成功，其它失败
  ,"msg": "" //提示信息 //一般上传失败后返回
  ,"data": {
    "src": "图片路径"
    ,"title": "图片名称" //可选
  }
}

php部分
图片上传接口

public function up()
 {
     //设置php 不超时
     @ini_set('memory_limit', '-1');
     @set_time_limit(0);
     $param = $this->request->param();
     $file = request()->file('file');
     // 移动到框架应用根目录/public/uploads/ 目录下
     if ($file) {
         $info = $file->move(ROOT_PATH . 'public' . DS . 'uploads');
         if ($info) {
             $url = aliyunOss('uploads/' . $info->getSaveName(), 'edityuesao');
             $data['code'] = 0;
             $data['msg'] = '';
             $data['data']['src'] = $url ;
             return json($data);
         } else {
             // 上传失败获取错误信息
             echo $file->getError();
         }
     }
 }
 //上传的图片直接存在阿里云OSS上面了
function aliyunOss($savePath, $category = '', $isunlink = 1)
{
    $bucket = config('Bucket');
    $accessKeyId = config('KeyId');//去阿里云后台获取秘钥
    $accessKeySecret = config('KeySecret');//去阿里云后台获取秘钥
    $endpoint = config('Endpoint');//你的阿里云OSS地址
    $ossClient = new OssClient($accessKeyId, $accessKeySecret, $endpoint);
    //判断bucketname是否存在，不存在就去创建
    if (!$ossClient->doesBucketExist($bucket)) {
        $ossClient->createBucket($bucket);
    }
    $category = empty($category) ? $bucket : $category;
    $savePath = str_replace("\\", "/", $savePath);
    $object = 'xmzp/' . $category . '/' . $savePath;//想要保存文件的名称
    $object = str_replace('uploads/', '', $object);
    try {
        $ossClient->uploadFile($bucket, $object, $savePath);
        $os = getcwd() . '/' . $savePath;
        if ($isunlink == 1 && is_file($os)) {
            chmod($os, 0777);
            unlink($os);
        }
    } catch (OssException $e) {
        printf(__FUNCTION__ . ": FAILED\n");
        printf($e->getMessage() . "\n");
        return;
    }
    $oss = config('url');
    $url = $oss . "/" . $object;
    return $url;
}

表单提交后数据处理接口

提交的数据处理入库