Vue卡壳问题汇总

• 上传文件问题(特别注意同步和异步请求)

- 手动构造'数组对象'发送给后端,后端可以正常接收
- 选取excel文件并读取,构造'数组对象'发送给后端,后端只收到一个空list
	- 原因如下: 读取excel函数的逻辑是异步请求,还没等数据处理完,请求就发给后端了,造成以上结果

uploadHttpRequest(e) {
        
        if(!this.isCheck){
          return
        }
       
        let file = e.file
        const fileReader = new FileReader()
        fileReader.onload = (ev) => {
          try {
            const data = ev.target.result
            const workbook = XLSX.read(data, {
             
              type: 'binary'
            })
           
            const exlname = workbook.SheetNames[0]
            const exl = XLSX.utils.sheet_to_json(workbook.Sheets[exlname]) // 生成json表格内容
           
            const arrayWithEnglishKeys = this.translateKeysInArray(exl, this.mappingTable);
         
            var collectedArr = []
            arrayWithEnglishKeys.forEach(item=>{
              if(item.level == '↑'){
                item.level = 1
              }else if(item.level == '↓'){
                item.level = 2
              }else{
                item.level = 0
              }
              collectedArr.push(item)
            })

            this.dataArray = collectedArr
            console.log(this.dataArray)
            // 发请求的逻辑必须放在这里,放外面就是异步,后端接收到的只是空list
            let res = this.$API.baiduData.reqDemoData(this.dataArray)
           
          } catch (e) {
            this.$message.error('excel格式解析失败,请检查问题！');
            return false
          }
        }
        
        fileReader.readAsBinaryString(file)

      
      },