elementui: 上传excel

最新推荐文章于 2024-06-18 10:25:18 发布

原创最新推荐文章于 2024-06-18 10:25:18 发布 · 886 阅读

1 ·

CC 4.0 BY-SA版权

elementui 专栏收录该内容

5 篇文章

订阅专栏

本文介绍两种将Excel数据导入系统的方法：一是通过解析JSON数据手动上传；二是直接上传Excel文件。涉及的技术包括文件读取、二进制字符串处理及前端组件交互。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

方法1. 得到excel的josn数据,进行手动上传到后台

[{“模板所属类目”:“1,17”,“模板种类”:1,“标题”:“这是标题”,“关键词”:“申达股份;haha”,“参数类型”:“1;2”,“参数示例”:“撒旦法;似懂非懂”,“场景说明”:“萨芬的”,“消息优先级”:4}]

            <vk-button
                    type="primary"
                    size="small"
                    class="uploadBtn"
                >新增消息模板（Excel导入）
                <!-- Excel表格文件生成的文件扩展名是：“.xls”或者“.xlsx”。 -->
                <vk-upload
                    class="upload"
                    action=""
                    accept=".xlsx,.xls"
                    :auto-upload="false"
                    :show-file-list="false"
                    :on-change="importFn">
                    <vk-button size="small" type="primary">点击上传</vk-button>
                </vk-upload>
                </vk-button>
            </div>

// import XLSX from 'xlsx';

        // importFn(file, fileList) {
        //     const fileReader = new FileReader();
        //     fileReader.onload = (ev) => {
        //         try {
        //             const data = ev.target.result;
        //             const workbook = XLSX.read(data, {
        //                 type: 'binary'
        //             });
        //             console.log(workbook);
        //             let sheet = Object.keys(workbook.Sheets)[0];
        //             const json = XLSX.utils.sheet_to_json(workbook.Sheets[sheet]); // 获得以第一列为键名的sheet数组对象
        //             console.log(JSON.stringify(json));
        //         } catch (e) {
        //             console.log(e);
        //         }
        //     };
        //     fileReader.readAsBinaryString(file.raw);
        // },

方法2：上传excel文件到服务器