【Vue原生input输入框上传文件】

Vue原生input输入框上传文件

<template>
	<div>
		<el-button  type="primary">
			<a href="http://xxx.xlsx">导入模板下载</a>
		</el-button>
 		<el-button type="primary" @click="$refs.filesRef.click()">
            导入excel
        </el-button>
        <input
           type="file"
           hidden
           ref="filesRef"
           accept=".xls, .xlsx"
           @change="saveEditIn"
            />
          </el-button>
	</div>
</template>

<script>
export default {
  name: "Device",
  setup() {
     const saveEditIn = (e) => {
      let file = e.target.files[0];
      const formData = new FormData();
      formData.set("file", file);
      api.excelMethod(formData).then((data) => {
        console.log("files文件的导入结果:", data);
     });

    const filesRef = ref(null);
    	return {filesRef,saveEditIn}
    };
}
 </script>