zoukankan      html  css  js  c++  java
  • uniapp 使用uview框架完成图片上传,后端Thinkphp5.1

    刚开始遇到了很多坑,为了避免大家踩坑,直接上代码:

      template

    <u-upload 
    	ref="uUpload"
    	:action="action" 
    	:auto-upload="true" 
    	max-count="9" 
    	name="image"
    	size-type="['compressed']"
    	max-size="3145728"
    	>
    </u-upload>
    <u-button @click="submit">提交</u-button>
    

      script

    data() {
    			return {
    				// 服务器地址
    				action: getApp().globalData.api_url +'/index/Api/upload',
    			}
    		},
    		methods: {
    			submit() {
    				let files = [];
    				// 通过filter,筛选出上传进度为100的文件(因为某些上传失败的文件,进度值不为100,这个是可选的操作)
    				files = this.$refs.uUpload.lists.filter(val => {
    					return val.progress == 100;
    				})
    				// 如果您不需要进行太多的处理,直接如下即可
    				// files = this.$refs.uUpload.lists;
    				console.log(files)
    			},
    }
    

      PHP

    //接收图片信息并存在本地
        public function upload(){
            // 获取表单上传文件
            $file = request()->file('image');
            // 移动到框架应用根目录/uploads/ 目录下
            $info = $file->validate(['size'=>3145728,'ext'=>'jpg,png,gif,JPG,PNG'])->move( '../public/uploads');
            if($info){
                // 成功上传后 获取上传信息
                $return_data = array(
                    'code'=>0,
                    'msg'=>"图片上传成功!",
                    'result'=>"uploads/".$info->getSaveName(),
                );
                return json_encode($return_data);
            }else{
                // 上传失败获取错误信息
                $return_data = array(
                    'code'=>1,
                    'msg'=>$file->getError(),
                );
                return json_encode($return_data);
            }
        }
    

      

  • 相关阅读:
    mysql之SQL入门与提升(三)
    DROOLS通过URL访问changset
    drools规则管理Guvnor的安装
    kafka offset manage
    kafka comsumer
    kafka与zookeeper
    kafka数据祸福和failover
    kafka一些问题点的分析
    近期开发storm遇到一些问题的解决点
    关于大数据平台ETL可行性方案
  • 原文地址:https://www.cnblogs.com/ffyun/p/14121640.html
Copyright © 2011-2022 走看看