vue2上传文件实现，点击按钮选择文件，选择文件后，在输入框内显示文件路径,不使用elementui

要实现Vue2中的上传文件功能，可以结合HTML5中的`<input type="file">`元素和Vue的数据绑定机制来实现。具体步骤如下：

1. 在Vue组件中添加一个文件选择框和一个文本输入框，分别用于选择文件和显示文件路径：

<template>
  <div>
    <input type="file" ref="fileInput" @change="onFileChange">
    <input type="text" v-model="filePath" readonly>
  </div>
</template>

<script>
export default {
  data() {
    return {
      filePath: ''
    }
  },
  methods: {
    onFileChange(event) {
      this.filePath = event.target.value.split('\\').pop();
    }
  }
}
</script>

其中，`<input type="file">`元素用于选择文件，`<input type="text">`元素用于显示文件路径。`v-model`指令用于将输入框的值与组件的`filePath`数据绑定，`readonly`属性可以让输入框只读，避免用户手动编辑。`@change`指令用于监听文件选择框的`change`事件，当用户选择文件后，将文件路径显示在文本输入框中。

2. 在Vue组件的`methods`中实现文件选择框的`change`事件处理方法，将选择的文件路径更新到组件的`filePath`数据中：

methods: {
  onFileChange(event) {
    this.filePath = event.target.value.split('\\').pop();
  }
}

其中，`event.target.value`表示文件选择框的值，即选择的文件路径，`split('\\').pop()`用于从文件路径中提取文件名。

需要注意的是，由于浏览器安全限制，JavaScript不能直接获取文件的完整路径，只能获取文件名。因此，文件路径的显示可能只包含文件名，而不是完整的文件路径。