关于uniapp上传文件的一些api文档

上传文件：

uni.chooseMessageFile(Object object)

官方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是根据获取简历信息的后台接口返回的数据   代表了当前上传的文件真实路径地址<view class="resume-icon" @click="downloadAndOpenDocument(item.resumeUrl)">
<image :src="getStaticIconPath('openResume.png')" mode="aspectFit" style="width: 40rpx; height:40rpx;"></image>
</view>

因为有其他组件可能也会用到上传文件的地方，所以我把上传文件的方法写到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);});},

下载文件资源到本地：

uni.downloadFile(OBJECT)

官方api文档详细说明地址：uni.uploadFile(OBJECT) | uni-app官网

//mixin.js文件  混入，公共组件 * 下载文件到本地//url是从其他组件传过来的，代表着上传文件的url地址downloadFile(url) {   //下载资源的 urlreturn 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()}})});},

打开下载的本地文件：

uni.openDocument(OBJECT)

官方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()}})},

关于uniapp上传文件的一些api文档相关推荐

curl跨服务器请求文件,Curl上传文件的服务器API POST调用
我想将一系列POSTMAN调用翻译成bash以创建脚本.超级简单到现在,我要发布与形式,data.I角色的XLSX文件中使用这个脚本:Curl上传文件的服务器API POST调用 curl -i -X ...
如何将WPS云文档创建到计算机,WPS怎么添加电脑上的文件夹到云文档
WPS添加电脑上的文件夹到云文档的解决方法:首先找到桌面上的"WPS文字",鼠标右键选择并点击"属性":然后在弹出的属性页面,点击"打开文件位置&qu ...
wps文件怎么到云服务器,怎么添加WPS电脑上的文件夹到云文档
怎么添加WPS电脑上的文件夹到云文档发布时间:2020-07-24 10:55:09 来源:亿速云阅读:95 作者:Leah 怎么添加WPS电脑上的文件夹到云文档?很多新手对此不是很清楚,为了帮助 ...
uniapp图片上传，uniapp视频上传，uniapp附件上传，uniapp上传文件、uniapp文件上传组件
uniapp文件上传组件,支持图片.视频上传 html部分: <template><view class="annex-wrap"><view cla ...
uni-app上传文件并给文件添加水印
uni-app在app端使用uview上传文件并添加水印,踩坑 1.返回的文件是临时路径的:参考这个https://blog.csdn.net/sansanyuner/article/details/ ...
修改 Joomla! 1.5 的 HTML 输出而不动核心文件（附api文档）
现在到了 Joomla! 1.5 平台,前面这个方法不灵了.不过,Joomla! 开发团队早就给出了更好的方案,总结起来就是3个字母:MVC. MVC in php Programming MVC 等 ...
java word上传下载_JSP实现word文档的上传，在线预览，下载
前两天帮同学实现在线预览word文档中的内容,而且需要提供可以下载的链接!在网上找了好久,都没有什么可行的方法,只得用最笨的方法来实现了.希望得到各位大神的指教.下面我就具体谈谈自己的实现过程,总结一 ...
【免费制作电子杂志】云展网教程 | 上传双页的PDF文档进行切割使杂志单页显示？
打开文件设置选项选择高级设置对杂志进行切割: [云展网教程] 有四种切割方法可以选择,其实选择时候已经能看得很清楚: 首先我制作了一份PDF,一共4页.(1,2),(3,4),(5,6),(7,8) ...
python上安装reuquest_八爪鱼增值API文档
访问频率限制为了更稳定地使用我们的服务,建议接口访问频率不超过20次/秒,访问过快有可能会收到429的状态码而导致访问失败,此时请降低访问频率到20次/秒以下或者更低. 我们建议以平稳的频率访问接口 ...

关于uniapp上传文件的一些api文档

uni.chooseMessageFile(Object object)

uni.downloadFile(OBJECT)

uni.openDocument(OBJECT)

关于uniapp上传文件的一些api文档相关推荐

最新文章

热门文章