layui集成wangEdit富⽂本编辑器
写出layui这个框架的⼈绝壁是⼀个⼤⽜，很⼤很⼤的⼤⽜，前端菜鸟表⽰除了顶礼膜拜就只剩下五体投地了【此处省去洋洋洒洒五千字崇拜】。。。。
⽤了⼀次layui后台模板后就爱上了，我选的是2.3版本的，结果在集成了官⽹给的编辑器后，发现功能着实有点少，不⽀持图⽚批量上传，不能对图⽚⼤⼩进⾏设置，不能查看源码，代码简洁了但是功能去除了不少，满⾜不了后台功能开发，虽说官⽹说了会在后⾯版本完善，⽼夫着实等不了，就⾃⼰集成了⼀个。
下⾯是layui官⽹的编辑器和wangedit编辑器对⽐图：
很明显的第⼆个更加强⼤，风格和layui也很接近，⽐较适合。
前端代码⽚段：
<!--样式引⽤-->
<link rel="stylesheet" href="__ADMINSTYLE__/wangEditor/css/wangEditor.min.css">
<script type="text/javascript" src="__ADMINSTYLE__/wangEditor/js/wangEditor.min.js"></script>
<!--html设置容器-->
<div class="layui-form-item">
<label for="phone" class="layui-form-label">⽂章内容</label>
<div class="layui-input-block">
<textarea id="content" name="content" ></textarea>
</div>
</div>
<!--js初始化编辑器-->
var editor = new wangEditor("content");
服务端图⽚上传代码：
//富⽂本上传图⽚接⼝
public function edit_upload_img(){
$file = request()->file('wangEditorH5File');网页模板编辑器
$info = $file->move(ROOT_PATH.'/public/uploads/edit');        $back_array = array();  //定义⼀个返回的数组
if($info){
$src = '/uploads/edit/'.$info->getSaveName();
}else{
$src = '';
}
return $src;
}
其他的form表单遵循layui form传输标准即可

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。