layui+tp5.1上传图片

1.html部分

<div class="layui-form-item" id="img">
    <label class="layui-form-label">
        <span class="x-red">*</span>店铺logo
    </label>
    <button type="button" class="layui-btn" id="upload_img_icon">
        <i class="layui-icon">&#xe67c;</i>上传图片
    </button>
</div>

2.layui部分

layui.use(['form','layer','laydate','upload'], function(){
     $ = layui.jquery;
     ,layer = layui.layer;
     var upload = layui.upload;
     //普通图片上传
	 var uploadInst = upload.render({
         elem: '#upload_img_icon' //绑定元素
         ,url: '{:url("Common/upload")}' //上传接口
         ,done: function(res){
         	console.log(res.filename);
         	  $('#img').append('<img src="/public/'+res.filename+'" style="width:150px;height:40px;"/><input type="hidden" value="'+res.filename+'" name="imagepath"/>');
         }
         ,error: function(){
             //请求异常回调
         }
    });
})

3.php部分

//上传图片
public function upload(){
    $file = request()->file('file');
	 // 移动到框架应用根目录/public/uploads/ 目录下
	 if($file){
	     $info = $file->move('./uploads');
	     if($info){
	     	$result=[
	     	    'code'=>1,
	     	    'msg'=>'上传成功',
	     	    'filename'=>'/uploads/'.str_replace('\\', '/', $info->getSaveName())
	     	];
	     	return json_encode($result);
	     }else{
	     	return false;
	     }
	 }else{
	 	return false;
	 }
}