首页 >  vue代码 >  exce数据使用xlsx读取转换成JSON

excel数据使用xlsx读取转换成JSON

时间：2023-12-27

一般读取excel的工作都由后端完成，比如java使用poi插件。如果存在少量非敏感数据，比如日志、模板数据，可以直接由前端搞定。

使用xlsx插件

一、安装

可以安装以下版本，不会出现问题

yarn add xlsx;

"dependencies": { 

     "xlsx": "^0.18.5"

   }

二、直接使用插件

<script>

import * as XLSX from "xlsx";

export default {

  components: { 

      XLSX,

   },

  data(){

     return{

       content:"",  

     }  

  },

  methods:{

     readExcel(files) {

      const fileReader = new FileReader();

      fileReader.readAsBinaryString(files);

      fileReader.onload = (e) => {

        try {

          const data = e.target.result;

          const workbook = XLSX.read(data, {//将上传的文件读取成workbook 即excel工作簿

            type: "binary",

          });

          const wsname = workbook.SheetNames[0]; // 取第一sheet，如果由多个可以循环获取

          const ws = XLSX.utils.sheet_to_json(workbook.Sheets[wsname]); // 直接调用方法将excel数据读取成json

          this.content = ws;//返回给content

          this.$refs.excel_upload.clearFiles();  //清空文件

        } catch (e) {

          console.log(e);

          return false;

        }

      };

    },

 }

}

</script>