使用xlsx.full.min.js处理excel表格

最新推荐文章于 2024-03-29 12:46:57 发布

livezsw

最新推荐文章于 2024-03-29 12:46:57 发布

阅读量2.4k

点赞数 2

分类专栏： JavaScript 文章标签： vue

本文链接：https://blog.csdn.net/qq_41111677/article/details/115011427

版权

JavaScript 专栏收录该内容

28 篇文章 0 订阅

订阅专栏

下载地址：xlsx.full.min.js

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css" />
  </head>
  <body>
    <div id="app">
      <el-upload ref="upload" action="/" :show-file-list="false" :on-change="importExcel" :auto-upload="false">
        <el-button size="mini" class="importBtn">点击上传Excel表格</el-button>
      </el-upload>
    </div>
  </body>
  <script src="https://unpkg.com/vue/dist/vue.js"></script>
  <script src="https://unpkg.com/element-ui/lib/index.js"></script>
  <script src="js/xlsx.full.min.js"></script>
  <script>
    new Vue({
      el: '#app',
      data: function () {
        return {}
      },
      methods: {
        // 导入Excel
        importExcel(file) {
          let types = file.name.split('.')[1]
          let fileType = ['xlsx', 'xlc', 'xlm', 'xls', 'xlt', 'xlw', 'csv'].some((item) => item === types)
          if (!fileType) {
            this.$message('格式错误！请重新选择')
            return
          }
          this.file2Xce(file).then((tabJson) => {
            console.log(tabJson[0])
          })
        },
        // 处理Excel数据
        file2Xce(file) {
          return new Promise(function (resolve, reject) {
            let reader = new FileReader()
            reader.onload = function (e) {
              let data = e.target.result
              this.wb = XLSX.read(data, {
                type: 'binary'
              })
              let result = []
              result.push(XLSX.utils.sheet_to_json(this.wb.Sheets['Sheet1']))
              resolve(result)
            }
            reader.readAsBinaryString(file.raw)
          })
        }
      }
    })
  </script>
</html>

livezsw

关注

2
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
使用xlsx.full.min.js处理excel表格

下载地址：xlsx.full.min.js<!DOCTYPE html><html> <head> <meta charset="UTF-8" /> <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css" /> </head> <body> <div id="..
复制链接

扫一扫