typeScript在react中使用注意点 个人笔记 持续更新

1 axios报错 类型声明

try {
      await dispatch(SendMessage(mobile))
      // 成功
     XXXXX
    } catch (err) {
      const error = err as AxiosError<{ message: string }>
      // 失败
     XXXXXX
    }

2 统一的axios的响应类型 例如token声明

在data.d.ts中声明

/* eslint-disable camelcase */
export type Token = {
    token: string,
    refresh_token: string
}
// 统一的axios的响应类型
export type ApiResponse<T> = {
    message: string
    data: T
}

action中使用 http.post<ApiResponse<Token>>

export const getLogin = (val: LoginMessage): RootThunkAction => {
  return async (dispatch) => {
    const res = await http.post<ApiResponse<Token>>('/authorizations', val)
    // 1 将值保存在store中
    dispatch({
      type: 'SETTOKEN',
      token: res.data.data
    })
    // 2 将值保存在本地
    setToken(res.data.data)
  }
}