通过的vue结合原生的input 进行本地文件系统目录、路径的选择（不需要ActiveXObject，任何浏览器都支持）

先看效果

传统的文件处理会有一些文件上传相关的插件，但有时候会有一些需求是不能简单选择一个文件上传就能解决的，如果要本地文件目录中的文件进行相关的逻辑处理，就比较麻烦，然后我做了本地一个文件目录选择的例子，只要得到目录地址，后面想怎么操作就看大家发挥了, 先看代码：

注解：
1处这里是一个普通的html 按钮，值得注意的是这里需要多加一个 webkitdirectory 参数，表示文件夹选择器。
2处是选择过后中，在页面中回显的入口，可根据自己需求处理
3处是做为vue的事件触发入口 ，回样可根据自己需要来。
大概就这些，有什么不懂的或有什么想法可以留言交流。

原码片断

大概就这些，有什么不懂的或有什么想法可以留言交流.

<el-form ref="form" :model="form" label-width="120px" style="width: 50%">
      <el-form-item label="保存至文件夹">
        <input type="file" id="file" hidden @change="fileChange" webkitdirectory>
        <el-input placeholder="请输入内容" v-model="form.imgSavePath" class="input-with-select">
          <el-button slot="append" icon="el-icon-folder" type="success" @click="btnChange"></el-button>
        </el-input>
      </el-form-item>
    </el-form>

data() {
    return {
      form: {
        imgSavePath: ''
      }
    }
  },
  methods: {
    fileChange(e) {
      try {
        const fu = document.getElementById('file')
        if (fu == null) return
        this.form.imgSavePath = fu.files[0].path
        console.log(fu.files[0].path)
      } catch (error) {
        console.debug('choice file err:', error)
      }
    },
    btnChange() {
      var file = document.getElementById('file')
      file.click()
    }
  }