此处为须要插件

  • xlsx
  • 此处为vue父组件引入办法
    // import excel from "./components/upload-excel.vue";    // <excel v-on:getResult="updateExcel"></excel>

此处为编辑好的vue组件

<template>    <div>        <span>            <input class="input-file" hidden="hidden" type="file" @change="exportData"                accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" />            <a-button class="m-x-10" type="primary" @click="btnClick">                导入            </a-button>        </span>    </div></template><script>    //图标组件要独自引入    import { defineComponent, reactive, onMounted, toRefs, computed } from "vue";    // import { UpOutlined, DownOutlined } from '@ant-design/icons-vue';    // import { message } from 'ant-design-vue';    // import { useStore } from 'vuex';    // import { useApi } from '@/common/utils/api';    export default defineComponent({        components: {},        setup(props, context) {            const data = reactive({});            const methods = {                btnClick() {                    document.querySelector(".input-file").click();                    //                },                exportData(event) {                    if (!event.currentTarget.files.length) {                        return;                    }                    // 拿取文件对象                    const f = event.currentTarget.files[0];                    // 用FileReader来读取                    const reader = new FileReader();                    // 重写FileReader上的readAsBinaryString办法                    FileReader.prototype.readAsBinaryString = function (f) {                        let binary = "";                        let wb; // 读取实现的数据                        let outdata; // 你须要的数据                        const reader = new FileReader();                        reader.onload = function (e) {                            // 读取成Uint8Array,再转换为Unicode编码(Unicode占两个字节)                            const bytes = new Uint8Array(reader.result);                            const length = bytes.byteLength;                            for (let i = 0; i < length; i++) {                                binary += String.fromCharCode(bytes[i]);                            }                            // 接下来就是xlsx了,具体可看api                            //上行必须加上,否者报错                            // eslint-disable-next-line @typescript-eslint/no-var-requires                            const XLSX = require("xlsx");                            wb = XLSX.read(binary, {                                type: "binary",                            });                            outdata = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);                            // 自定义办法向父组件传递数据                            // console.log("outdata = " + JSON.stringify(outdata));                            // console.log(outdata);                            context.emit("getResult", outdata);                        };                        reader.readAsArrayBuffer(f);                    };                    reader.readAsBinaryString(f);                },            };            return {                ...toRefs(data),                ...methods,            };        },    });</script>