vue 导入xlsx

Posted 2023-03-22

参考技术A npm install xlsx --s

handlePreview(file) 

        // console.log(file);

        this.importfile(file.raw)

        this.fileList = []

      ,

importfile (obj) 

        const _this = this

        const reader = new FileReader()

        reader.readAsArrayBuffer(obj)//需要传blob类型

        reader.onload = function () 

          const buffer = reader.result

          const bytes = new Uint8Array(buffer)

          const length = bytes.byteLength

          let binary = ''

          for (let i = 0; i < length; i++) 

            binary += String.fromCharCode(bytes[i])

          

          const XLSX = require('xlsx')//引用

          const wb = XLSX.read(binary, 

            type: 'binary'

          )

          let tableList = ['业务类型','用户订单号','快递单号']

          for( let i = 0; i<tableList.length; i++ ) 

            if ( wb.Strings[i].t != tableList[i] ) 

              _this.$message.error('格式错误，请重新上传');

              return false

            

          

          const outdata = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]])

          // console.log(outdata) // 此为取到的excel中内容，然后就可以自己改数据，画页面啦~

          _this.allVisible = true

          let dataStr = []

          for ( let i = 0; i<outdata.length; i++ ) 

            dataStr.push(

              expressName: outdata[i].业务类型 == undefined ? '':outdata[i].业务类型,

              expressNumber: outdata[i].用户订单号 == undefined ? '':outdata[i].用户订单号,

              orderId: outdata[i].快递单号 == undefined ? '':outdata[i].快递单号.toString(),

            );

          

          _this.allTableData = dataStr

        

      ,

vue导入的xlsx没有数据

参考技术A Excel表格打开以后显示空白页没有数据是由于表格的数据隐藏了。
1、在“视图”工具中，点击“取消隐藏功能”。
2、在点击取消隐藏后，选择需要查看隐藏数据的表格即可。