刚开始遇到了很多坑,为了避免大家踩坑,直接上代码:
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);
}
}