通过阅读官方文档发现，uni.chooseFile在app端不支持非媒体文件上传；
可以使用这个插件，验证过可以上传pdf；具体使用可以去看文档
插件地址
就是还是会出现相机，这个可能需要自己解决下
实现功能：上传只能上传一个，如果文件列表有值点击上传进行toast提示，不再出现选择文件弹框，
只获取数据，展示的文件列表使用uview的u-cell-group文章来源地址https://www.toymoban.com/news/detail-637598.html
<template>
<view class="day-que-page">
<view class="feed-content">
<u--form ref="uForm" :labelWidth="70">
<u-form-item label="附件上传" prop="fileName" required>
<lsj-upload ref="lsjUpload" childId="dayUpload" :option="option" :formats="formats" :debug="debug"
@uploadEnd="onuploadEnd" @progress="onprogre" @change="change" :multiple="false" :accept="accept">
<u-button type="primary" @click="hanldUpload" size="mini"
style="width: 180rpx;height: 30px;margin-top: 10rpx;">选择文件</u-button>
</lsj-upload>
</u-form-item>
</u--form>
<view class="" style="padding:24rpx">
<u-cell-group>
<u-cell v-for="(item, index) in imageValue" :key="index" v-if="imageValue.length" :title="item.name">
<u-icon slot="right-icon" size="12" name="close" @click="hanldDelete(item)"></u-icon></u-cell>
</u-cell-group>
</view>
</view>
<u-toast ref="uToast"></u-toast>
<view class="feed-bottom">
<u-button text="完成" type="primary" @click="toTemplatePage" :loading="btnLoading"></u-button>
</view>
</view>
</template>```
```javascript
import {
confrimFeedBack
} from "../../utils/meetingDetail"
export default {
data() {
return {
fileList: [],
dateId: "",
imageValue: [],//文件存放列表
option: {
url: this.$store.state.baseUrl + "/api/psm/file/upload/file",//服务器地址
name: 'file',
header: {
'Authorization': `Bearer ${uni.getStorageSync('token')}`
}
},
accept: "application/pdf",
formats: "pdf",
debug: true,
files: new Map(),
btnLoading:false
}
},
methods: {
async toTemplatePage() {
if (!this.imageValue.length) {
this.showToastDesc("请进行附件上传");
return;
}
let pages = getCurrentPages();
let curPage = pages[pages.length - 1]; //当前页
const prePage = pages[pages.length - 2]; //上一页
prePage.$vm.getDayQueData(this.imageValue)
uni.navigateBack({
delta: 1
})
},
hanldUpload() {
if (this.imageValue.length) {
this.showToastDesc("只能上传一个文件");
return;
}
},
//单个删除上传文件
hanldDelete(itemFile) {
this.imageValue.map((item, index) => {
if (item.path === itemFile.path) {
this.imageValue.splice(index, 1)
}
});
},
showToastDesc(text) {
this.$refs.uToast.show({
message: text,
type: 'error',
})
},
//完成上传
onuploadEnd(item) {
console.log(`${item.name}已上传结束，上传状态=${item.type}`);
if (item['responseText']) {
console.log('演示服务器返回的字符串JSON转Object对象');
const responseText = JSON.parse(item.responseText);
console.log(responseText, "上传成功的数据");
if (responseText.code === 200) {
this.imageValue.push({
name: item.name,
url: responseText.data
});
this.btnLoading=false;
} else {
this.showToastDesc(responseText.msg || "上传失败，请重试")
}
};
},
onprogre(item) {
// 更新当前状态变化的文件
this.files.set(item.name, item);
console.log('打印对象', JSON.stringify(this.files.get(item.name)));
},
change(files) {
const fileData = JSON.stringify([...files.values()]);
if (fileData?.length) {
const url = JSON.parse(fileData)[0].path;
const name = JSON.parse(fileData)[0].name;
console.log(url, name, "获取文件url");
//触发上传
this.$refs['lsjUpload'].upload();
this.btnLoading=true;
}
// this.files = files;
},
},
onLoad(props) {
if (props.dayData && props.dayData !== 'null') {
const dealData = JSON.parse(decodeURIComponent(props.dayData));
// console.log(dealData)
this.imageValue = [{
...dealData
}];
}
//当文件列表本来就有值的时候，点击上传弹出提示，不再弹出选择文件弹框
//为什么使用setTimeout，option会触发show，导致设置的hide不生效
const timeout = setTimeout(() => {
if (this.imageValue.length) {
this.$refs['lsjUpload'].hide();
}
if (timeout) {
clearTimeout(timeout)
}
}, 600);
},
//监听文件列表的值，hide时候会触发hanldUpload
watch: {
imageValue(val) {
if (this.imageValue.length) {
this.$refs['lsjUpload'].hide();
}else{
this.$refs['lsjUpload'].show()
}
}
}
}
文章来源：https://www.toymoban.com/news/detail-637598.html
到了这里，关于uni-app之app上传pdf类型文件的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
