手机端app怎么开发,已矣seo排名点击软件,网站开发好学嘛,网上推广是什么意思好久没有更新文章了#xff0c;说说为什么会有这篇文章呢#xff0c;其实是应某个热线评论的要求出的#xff0c;不过由于最近很长一段时间没打开csdn现在才看到#xff0c;所以才会导致到现在才出。 先来看看封装完这个预览方法的使用#xff0c;主打一个方便使用#x…好久没有更新文章了说说为什么会有这篇文章呢其实是应某个热线评论的要求出的不过由于最近很长一段时间没打开csdn现在才看到所以才会导致到现在才出。 先来看看封装完这个预览方法的使用主打一个方便使用
id:为文件id
name:为文件名称
ajaxDownLoadFile(id, name)没错就是这么简单调用这个函数传入id和name就可以实现
进入正题我们需要怎么去封装这么个预览pdf的工具呢。
其实我们ajaxDownLoadFile这个方法的功能主要是通过传入id和name然后去实现预览pdf文件如果不是pdf文件的话点击后我们应该是有一个下载的功能。
实现我们说的这两个点主要是下面这两个函数 ajaxDownLoadFile 下载文件 ajaxPrePdf预览文件 // 下载文件ajaxDownLoadFile(id: string, name?: string) {const strRegex (.pdf)$ // 用于验证后缀是否是pdfconst re new RegExp(strRegex)// 如果文件名存在同时文件为pdfif (name re.test(name.toLowerCase())) {return ajaxPrePdf(id)} else {//不为pdf的文件直接请求接口下载文件return new Promise((resolve, reject) {service.get({url: XXX id,responseType: blob}).then(res {resolve(res)}).catch(err reject(err))})}},// 预览文件ajaxPrePdf(id: string) {return new Promise((resolve, reject) {service.get({url: XXX id,responseType: arraybuffer}).then(res {const file new Blob([res as any], {type: application/pdf})const fileUrl window.URL.createObjectURL(file)window.open(fileUrl)resolve(res)}).catch(err reject(err))})}所以其实真正实现预览文件的功能的其实就是ajaxPrePdf这个函数。
我们通过封装的方式让这个方法可以在我们整个项目中使用甚至其他项目需要到pdf预览其他文件下载的功能我们也可以直接拿过去用。主打一个简单实用。