vue下获取所选文件绝对路径

一番码客 : 挖掘你关心的亮点。http://efonfighting.imwork.net

本文目录：

前言vue中实现代码实际效果一番今日

前言

我们在开发electron桌面应用时，因为常常希望对一些本地文件做一些操作，需要获取到这个文件的绝对路径。今天一番在electron-vue下实现了单击按钮选择文件，并获取文件绝对路径然后显示出来的效果。在本来要放弃的时候突然柳暗花明。

vue中实现代码

这里涉及到在vue中定义和调用函数，需要用到关键字methods,然后便可以在里面定义函数了。

这里关键点：

document.getElementById(‘open’).files[0].path，这里获取文件路径的方法是获取文件类元素的数组，然后通过path关键字获取文件的绝对路径。 Welcome to EfonMark! 选择文件 显示路径 export default { data() { return { textarea: ” } }, methods: { openFile: function () { document.getElementById(‘open’).click() }, showRealPath: function () { document.getElementById(‘input01’).value = document.getElementById(‘open’).files[0].path } }}实际效果

点击“选择文件”，可以选中一个本地文件；

点击显示路径，可以将刚刚选择的文件的本地绝对路径显示在文本框内。