開(kāi)發(fā)中遇到的問(wèn)題

1.vue3中的reactive不會(huì)自動(dòng)更新視圖,可以在reactive里多添加一層屬性
2.echarts中封裝組件會(huì)公用同一個(gè)id的元素,可以在封裝組件時(shí)多傳入一個(gè)id
3.echarts在初次渲染時(shí)不會(huì)顯示,報(bào)警告,未獲取寬高,需要在初始化表格時(shí)添加配置寬高。

vue中遇到的問(wèn)題

1.設(shè)置下載pdf瀏覽器會(huì)預(yù)覽問(wèn)題
此方法也可解決下載時(shí)的名稱問(wèn)題

//fileName是pdf名稱 、filePath是pdf地址
downloadFile_2(fileName, filePath) { 
  var ajax = new XMLHttpRequest()
  ajax.open('GET', filePath, true)
  ajax.setRequestHeader('Cache-Control', 'no-cache')
  ajax.setRequestHeader('Access-Control-Allow-Origin', '*')
  ajax.responseType = 'blob'
  ajax.onload = (e) => {
    console.log(e)
    let res = e.target.response
    // let blob = new Blob([res],{type: "application/pdf;charset=UTF-8"}) // 這里的res為后端返回的流數(shù)據(jù)
    let blob = new Blob([res])
    let aLink = document.createElement('a')
    aLink.download = `${fileName}.pdf` // 下載文件的名字
    aLink.href = URL.createObjectURL(blob)
    aLink.click()
  }
  ajax.send()
},

2.前端上傳文件慢
使用OSS上傳


async function uploadOss(file, callback) {
  // 根據(jù)文件名后綴,獲取contentType
  const contentType = getContentType(file.name)
  // 調(diào)用授權(quán)接口,獲取到上傳地址
  const res = await axios({
    headers: { 'X-GW-AccessKey': window._env_.accessKey },
    method: 'post',
    url: getOssAuth,
    data: { fileName: file.name, contentType },
  })
  // oss返回結(jié)果
  const result = res && res.data && res.data.data
  if (result) {
    // 根據(jù)oss授權(quán)返回的地址,上傳文件
    let reader = new FileReader()
    return new Promise((resolve, reject) => {
      reader.readAsArrayBuffer(file)
      reader.onload = async (e) => {
        // 將File對(duì)象通過(guò)FileReader讀出轉(zhuǎn)換為Blob二進(jìn)制流對(duì)象
        const blob = new Blob([e.target.result])
        // 調(diào)用上傳
        const response = await axios({
          headers: result.uploadHeaders,
          method: result.requestMethod,
          url: result.serviceUrl,
          data: blob,
          onUploadProgress: (progressEvent) => {
            // 原生獲取上傳進(jìn)度的事件
            if (progressEvent.lengthComputable) {
              callback && callback(progressEvent)
            }
          },
        })
        const responseCode = response && response.status
        // 201代表上傳成功
        if (responseCode == 201) {
          let fileUrl = result && result.fileUrl
          const index = fileUrl.lastIndexOf('/')
          const fileName = fileUrl.substring(index + 1)
          // 如果是word或者excel,對(duì)url做個(gè)編碼
          const fileType = getFileType(fileName) && getFileType(fileName)[0] // ['word','docx']這種格式
          fileUrl = fileType == 'word' || type == 'excel' ? encodeURIComponent(fileUrl) : fileUrl
          const data = {
            fileName,
            fileUrl,
            fileType,
          }
          resolve(data)
        }
        return false
      }
    })
  }
  return false
}

小程序中的問(wèn)題

1.scroll-view enable-flex不生效
解決方案:父級(jí)設(shè)置white-space:nowrap 子級(jí)設(shè)置:display:inline-block

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容