tp5项目图片上传

控制器

    public function upload(){

        $file = request()->file('file');

        $arr =[];

        if($file){

            $info = $file->validate(['ext'=>'jpg,png,gif'])->move(ROOT_PATH.'public'.DS.'uploads');

            if($info){

                $arr['code'] = 1;

                $arr['msg'] = '/uploads/'.$info->getSaveName();

                

            }else{

                $arr['code'] = 2;

            }

        }else{

            $arr['code'] = 3;

        }

        return $arr;

    }

    //图片上传，ROOT_PATH表示根目录，DS表示点，getSaveName()为图片上传后的名字

视图html

<div class="layui-form-item">

                    <label class="layui-form-label">一队图片</label>

                    <div class="layui-input-block">

                      <button type="button" class="layui-btn" id="test2" >

                        上传图片

                      </button>

                      <img src="" alt="" id="img1">

                      <input type="hidden" name="img1" id="imgg1" value="">

                    </div>

                  </div>

                  <div class="layui-form-item">

                    <label class="layui-form-label">二队图片</label>

                    <div class="layui-input-block">

                      <button type="button" class="layui-btn" id="test3" >

                        上传图片

                      </button>

                      <img src="" alt="" id="img2">

                      <input type="hidden" name="img2" id="imgg2" value="">

                    </div>

                  </div>

 <script>

layui.use('upload', function(){

        var upload = layui.upload;

   

          //执行实例

        var uploadInst = upload.render({

          elem: '#test2' //绑定元素

          ,url: '{:url("Add/upload")}' //上传接口

          ,done: function(res){

          //上传完毕回调

          if(res.code == 1){

            document.getElementById('img1').src = res.msg;

            document.getElementById('imgg1').value = res.msg;

          }

        }

        ,error: function(){

        //请求异常回调

        }

      });

    });

    layui.use('upload', function(){

        var upload = layui.upload;

   

          //执行实例

        var uploadInst = upload.render({

          elem: '#test3' //绑定元素

          ,url: '{:url("Add/upload")}' //上传接口

          ,done: function(res){

          //上传完毕回调

          if(res.code == 1){

            document.getElementById('img2').src = res.msg;

            document.getElementById('imgg2').value = res.msg;

          }

        }

        ,error: function(){

        //请求异常回调

        }

      });

    });

    </script>