vue3+ts问题

1.ts封装axios,版本问题

vue3+ts问题_第1张图片

pnpm i axios@next

2.解决vue3+TS+axios请求拦截 headers 头提示为Object is possibly ‘undefined’.

vue3+ts问题_第2张图片

 1.通过解构将原有config复制一份,再拼接要添加的新属性

requestInterceptor:(config) => {
      // 携带token的拦截
      const token = ''
      if(token) {
        // config.headers!.Authorization = `Bearer ${token}`
        config.headers = {
          ...config.headers,
          Authorization : `Bearer ${token}`
        }
      }
      console.log('请求成功的拦截')
      return config
    }

2.在headers后加一个!告诉ts这个东西是一定存在的

    requestInterceptor:(config) => {
      // 携带token的拦截
      const token = ''
      if(token) {
        config.headers!.Authorization = `Bearer ${token}`
      }
      console.log('请求成功的拦截')
      return config
    }

3.ref>() 代码编译不通过,出现红色下划线。

在script 标签上写明使用ts语言,即

你可能感兴趣的:(vue.js,前端,javascript)