typescript类型的问题？

Question

我想解决的是res.Code下面的红线问题

下面是loginApi接口的类型定义：

export const loginApi = (data: UserType): Promise<IResponse<UserType>> => {
  return request.post({ url: '/BackLogin/Login', data })
}

其中UserType类型的定义：

export type UserType = {
  userNo: string
  password: string
  role: string
  roleId: string
  permissions: string | string[]
}

IResponse类型的定义：

 declare interface IResponse<T = any> {
    Code: string|int
    Data: T extends any ? T : T & any
    Msg:string|any
  }

为什么Promise的返回值Code,Data,Msg下面都带红线？

代码：

  const res = await loginApi(data).catch(e=>{
        loading.value=false
      })
      if (res.Code===0) {
        wsCache.set(appStore.getUserInfo, res.Data)
        // 是否使用动态路由
        if (appStore.getDynamicRouter) {
          console.log("动态路由")
        } else {
         
        }
      }else{
        ElMessage.error(res.Msg)
      }

Answer 1

  const res = await loginApi(data).catch(e=>{
        loading.value=false
      }) as IResponse<UserType>;
      if (res && res.Code===0) {
        wsCache.set(appStore.getUserInfo, res.Data)
        // 是否使用动态路由
        if (appStore.getDynamicRouter) {
          console.log("动态路由")
        } else {
         
        }
      }else{
        ElMessage.error(res.Msg)
      }

但看loginApi的类型声明，是没什么问题的，建议为request.post添加类型声明。

export const loginApi = (data: UserType): Promise<IResponse<UserType>> => {
  return request.post<UserType>({ url: '/BackLogin/Login', data });
}

Answer 2

出现红线的原因是因为：catch的处理

const res = await loginApi().catch(e => {
      return Promise.reject()
})

你如果走了catch后不需要走下面了，可以这么处理。