• Bartender文件.btw(ANSI)进行base64加密存进数据库,下载文件时需要进行atob解码在转成bytes字节后,new Blob()才能得到ANSI编码的文本


    使用element UI的upload组件

                    <el-upload
                      action=""
                      :auto-upload="false"
                      :file-list="fileList"
                      :limit="1"
                      :multiple="false"
                      :on-change="handleChange"
                      :on-preview="handlePreview"
                      :on-error="uploadError"
                      :on-remove="removefile"
                      :show-file-list="true"
                      accept=".btw"
                      ref="upload"
                    >
                      <el-button @click="handleExport()" slot="trigger" type="text">{{$t('template_define.button_upload')}}</el-button>
                    </el-upload>    

    methods方法

        // 文件上传触发
        handleChange (file, fileList) {
          let _this = this
          if (this.formdata.printMode !== 'Bartender') return
          this.formdata.remark = file.name
          let reader = new FileReader()
          reader.readAsDataURL(file.raw)
          reader.onload = function () {
            _this.fileList = fileList
            _this.bartenderstring = reader.result.substring(reader.result.indexOf('base64') + 'base64,'.length)
          }
        },
        decode (base64) {
          let decode = window.atob(base64)
          var len = decode.length
          var bytes = new Uint8Array(len)
          for (var i = 0; i < len; i++) {
            bytes[i] = decode.charCodeAt(i)
          }
          // let str = decodeURI(decode)
          return bytes
        },
        // 文件点击触发
        handlePreview (file) {
          try {
            let content = this.decode(this.bartenderstring)
            const blob = new Blob([content])
            let a = document.createElement('a');
            a.download = file.name + '.btw';
            a.href =  URL.createObjectURL(blob);
            let event = new MouseEvent('click');
            a.dispatchEvent(event);
          } catch (e) {
            console.log(e)
          }
        }
  • 相关阅读:
    Spring中配置文件applicationContext.xml配置详解
    Web.xml配置详解
    linux基础命令学习(七)samba服务器配置
    linux基础命令学习(六)DHCP服务器配置
    linux基础命令学习五(软件包管理、下载管理)
    linux基础命令学习(四)计划任务
    linux上安装php
    linux上安装hadoop
    Redis(二)Jedis操作Redis
    Redis(一)简介及安装、测试
  • 原文地址:https://www.cnblogs.com/xuesen1995/p/14578310.html
Copyright © 2020-2023  润新知