DefenitelyTyped of axiosの問題

Question

axとnymの両方をインストールしました。

は今、活字体でそれを使用するために、私はそれにタイプ（T）を渡す必要があります。問題は、このTが、リクエストのインターフェースとレスポンスのインターフェースの両方に使用されていることです。何の意味もありません。なぜなら、明らかに、サーバーは受け取ったのと同じタイプのデータを返さないからです。あなたが見ることができるように

interface ServerRepsonse { 
    userID: string; 
} 

interface ServerRequest { 
    username: string; 
    password: string; 
} 

var body = { 
     username: "username", 
     password: "password" 
    }; 

let response = await axios<ServerRequest>({ 
      method: 'POST', 
      url: "http://localhost:3000/users", 
      data: body 
     }); 

alert(response.data.userID); 

、この例ではreponse.data.userIDはエラーとしてマークされるだろう。代わりにServerResponseインターフェースを渡した場合、「data：body」はエラーとしてマークされます。

はaxiosのindex.d.tsファイルにその問題ですか？どうすれば解決できますか？私は "any"を使いたくない。

Answer 1

これは、現在の実装では、完全にジェネリックを使用していないようです。しかし、あなたはそれを拡張することができます。

これは、あなたが使用できるようになります次に

declare namespace Axios { 
    interface AxiosInstance { 
    <TRequest, TResponse>(config: AxiosXHRConfig<TRequest>): IPromise<AxiosXHR<TResponse>>; 
    post<TRequest, TResponse>(url: string, data?: TRequest, config?: AxiosXHRConfigBase<TResponse>): IPromise<AxiosXHR<TResponse>>; 
    } 
} 

でファイルtypings\axios.d.tsを作成

npm i @types/axios 

と種類axiosインストールします。

import * as axios from 'axios'; 

interface DataToSend { 
    name: string; 
} 
interface DataToReceive { 
    status: number; 
} 

axios<DataToReceive>({ url: '' }).then(r => r.data.status); 

axios<DataToSend, DataToReceive>({ 
    url: '', 
    method: 'POST', 
    data: { name: '' }, 
}).then(r => r.data.status); 

axios.post<DataToSend, DataToReceive>('', { name: 'test' }) 
    .then(r => r.data.status);