荆轲刺秦王
layui 的富文本编辑器小巧,界面简单大方,缺点也很明显,那就是功能相较于百度的富文本编辑器要少。
本文主要介绍了 layui 在富文本编辑器中上传完图片后 无法正常显示的问题及其解决方案。
其实图片无法显示的问题也很简单,layui 在文档里 说的也很清楚:
我第一次尝试的时候,文件没有显示出来的根本原因在于,返回的 json 数据格式不对,因为他的 code 为 0 的时候才表示成功,而我却定义的是 1 ,所以导致图片一直无法正常显示。
贴一下 我的上传代码:
//上传图片
public function upload(){
$file = request()->file('file');
if($file){
$info = $file->move('./uploads');
if($info){
$result['code'] = 0; //为了照顾到layui富文本编辑器的小脾气 所以此处必须要用0表示成功
$result['msg'] = '上传成功';
$result['data']['src'] = '/uploads/'.str_replace('\\', '/', $info->getSaveName());
$result['data']['title'] = '';
echo json_encode($result);exit();
}else{
$result['code'] = 2;
$result['msg'] = '上传失败';
$result['data']['src'] = '';
$result['data']['title'] = '';
echo json_encode($result);exit();
}
}else{
return false;
}
}
layui 的上传图片和富文本编辑器的图片上传部分,都可以用这一个后台接口。
还有就是,之所以要 echo json_encode();exit(); 是因为在TP5中 如果配置文件中 app_debug 的调试模式,如果为 true 的时候, return 和 echo();exit(); 的结果是不一样的。这个需要注意。
至于前台代码 就不啰嗦,在 layui 官方文档上都有详细的例子,几乎就是拿来即用。