上传文件:
官方api文档详细说明地址:wx.chooseMessageFile(Object object) | 微信开放文档
uni.chooseMessageFile({
count: 1, // 文件总数
type: 'file', // 文件类型
extension: ['doc', 'docx', 'pdf', 'pptx', 'ppt', 'xls', 'xlsx'], // 指定后缀名
success: (e) => {
that.uploadDocument(e.tempFiles[0])
},
fail: (err) => {
// 取消上传
//console.log(err);
}
});
触发 mixin.js文件中公用方法 downloadAndOpenDocument()全局函数,进行下载,打开文件
//item.resumeUrl是根据获取简历信息的后台接口返回的数据 代表了当前上传的文件真实路径地址
因为有其他组件可能也会用到上传文件的地方,所以我把上传文件的方法写到mixin混入公共组件中 ,并把mixin.js引入到man.js中,实现全局混入,这样其他组件使用起来就不用在引入mixin.js文件,可以直接使用mixin.js文件中的任何公用方法
//main.js文件
import mixin from '@/src/utils/mixin.js';
// 全局混入
Vue.mixin(mixin);
//mixin.js文件 混入,公共组件
* 下载并打开文件
downloadAndOpenDocument(url) {
this.downloadFile(url).then((res) => {
// console.log(res,'nnnnnn');
res.tempFilePath && this.openDocument(res.tempFilePath);
});
},
下载文件资源到本地:
官方api文档详细说明地址:uni.uploadFile(OBJECT) | uni-app官网
//mixin.js文件 混入,公共组件
* 下载文件到本地
//url是从其他组件传过来的,代表着上传文件的url地址
downloadFile(url) { //下载资源的 url
return new Promise((resolve, reject) => {
uni.showLoading({
title: '下载文档中...'
});
uni.downloadFile({
url,
success: (res) => {
// console.log(res,'kkkk');
resolve(res);
},
fail: (e) => {
// console.log(e,'aaaaaaa');
reject(e);
},
complete: () => {
uni.hideLoading()
}
})
});
},
打开下载的本地文件:
官方api文档详细说明地址:uni.saveFile(OBJECT) @savefile | uni-app官网
//mixin.js文件 混入,公共组件
* 打开文件
//url是从下载文件方法里传过来的文件路径地址
openDocument(url) { //url:文件的路径
uni.showLoading({
title: '打开文档中...'
})
uni.openDocument({
filePath: url, //文件路径,可通过 downFile 获得
showMenu: true, //右上角是否有可以转发分享的功能
success: (e) => {
},
fail: err => {
},
complete: () => {
uni.hideLoading()
}
})
},
mixin.js文件,下载并打开完整代码:
//mixin.js文件
* 下载并打开文件
downloadAndOpenDocument(url) {
this.downloadFile(url).then((res) => {
// console.log(res,'nnnnnn');
res.tempFilePath && this.openDocument(res.tempFilePath);
});
},
* 下载文件
downloadFile(url) {
return new Promise((resolve, reject) => {
uni.showLoading({
title: '下载文档中...'
});
uni.downloadFile({
url,
success: (res) => {
// console.log(res,'kkkk');
resolve(res);
},
fail: (e) => {
// console.log(e,'aaaaaaa');
reject(e);
},
complete: () => {
uni.hideLoading()
}
})
});
},
* 打开文件
openDocument(url) {
uni.showLoading({
title: '打开文档中...'
})
uni.openDocument({
filePath: url,
showMenu: true,
success: (e) => {
},
fail: err => {
},
complete: () => {
uni.hideLoading()
}
})
},