2017-01-08 8 views
0

ax와 nym과 타이핑을 모두 설치했습니다.DefenitelyTyped of axios의 문제

이제 TypeScript에서 사용하려면 유형 (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"를 사용하고 싶지 않습니다.

+0

을 당신이하지 않는 이유가 있나요 :이 사용할 수

그런 다음

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의 유형을 설치 [axios 프로젝트] (https://github.com/mzabriskie/axios/blob/master/index.d.ts)에 포함 된 정의 파일을 사용 하시겠습니까? –

답변

2

현재 구현에서는 제네릭을 완전히 사용하지 않는 것 같습니다. 그러나 당신은 그것을 확장 할 수 있습니다.

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);