87,993
社区成员
发帖
与我相关
我的任务
分享
...全文
请发表友善的回复…
发表回复
Oliver尹 2020-07-18
- 打赏
- 举报
改不了，改文件内容得用node的fs模块
luj_1768 2020-07-18
- 打赏
- 举报
可能与服务代码有关，可以试试url 有关的连接代码，应该能够访问得到、但是要注意安全性。
前端小黑 2020-07-17
- 打赏
- 举报
JavaScript做为html的脚本不允许读取本地文件，除非你使用node.js，使用fs模块就可以读取文件
Hello World, 2020-07-17
- 打赏
- 举报
不能直接读本地文件，上传后读取
资源下载链接为：
https://pan.quark.cn/s/9648a1f24758
在Web开发领域，文件上传、读取与下载功能极为常见且关键。本文旨在深入剖析如何借助Vue框架来实现这些功能，助力Web开发者掌握必备技能。
首先，Vue中实现文件上传，通常依赖HTML的标签搭配type="file"属性。用户通过点击文件选择按钮挑选待上传文件，文件选中后，可运用JavaScript处理文件数据并完成上传。示例代码里，采用Element UI的el-input组件取代普通标签，旨在借助Element UI的样式与功能优势，优化界面美观度与易用性。用户选定文件后，文件信息会在fileselect区域展示。代码中设置的readFile方法，承担着处理文件上传逻辑的重任。
其次，文件读取环节，FileReader对象大显身手。它使Web应用能够异步读取用户电脑上文件或原始数据缓冲区的内容，通过File或Blob对象指定读取目标。代码中创建FileReader实例，运用readAsText方法读取文件内容，并借助监听onload事件获取读取完成后的文件内容。若浏览器不支持FileReader接口，Vue的$message组件会及时提示用户。
再者，文件下载功能的实现，可通过创建标签并设置其href属性为文件URL来达成。点击该标签时，浏览器会自动下载对应文件。示例中的downloadFile方法，负责处理文件下载逻辑。它先将数据转为JSON字符串，再利用createObjectURL创建指向数据的URL，随后在隐藏的标签上设置href属性并触发点击事件，实现下载。不过，部分浏览器可能不支持download属性，需进行兼容性处理。downloadFile方法会检测浏览器是否支持该属性，以决定是否允许下载。
此外，Vue实例的基本结构也
