note 在线笔记

路由缓存

父组件:路由下的 第一个文件要加

note 在线笔记_第1张图片

note 在线笔记_第2张图片

note 在线笔记_第3张图片

三元表达式 value ? value : ''  简写

value ?? ''

value || ''

子组件调用父组件方法 实现 控制 父组件滚动条滚动到指定区域

  const backTodayScroll = () => {

    const targetElement = document.querySelector('#today')

    targetElement.scrollIntoView({ behavior: 'smooth' })

  }

       

  const emit = defineEmits(['backTodayScrollTo'])

  const backToday = () => {

    emit('backTodayScrollTo')

  }

导出文件下载 设置请求头 要在路由上修改

// 导出excel
export function exportClassRecord(data) {
  // 请求数据头
  return defHttp.post(
    {
      url: `/course/course-server/teacher/course-class/exportClassRecord`,
      data,
      responseType: 'arraybuffer' //在此增加请求头 把文件流格式修改 也可替换参数 为 blob
    },
    {
      isReturnNativeResponse: true
    }
  )
}

下载的方式 创建a标签然后点击生效 

    exportClassRecordRun(request).then(res => {
      const blob = new Blob([res.data])
      // 创建a标签
      const el = document.createElement('a')
      el.href = URL.createObjectURL(blob)
      let d = new Date()
      el.download = `${d.getTime()}.xlsx`
      // el.download = `${d.getTime()}.`
      document.body.appendChild(el)
      // 设置a标签链接参数
      // 重命名文件
      el.click()
      // 下载完成释放URL 对象
      URL.revokeObjectURL(el.href)
      el.remove()
      // 移除a标签
      document.body.removeChild(el)
    })

你可能感兴趣的:(前端)