Vue 中使用 TypeScript

axios 使用方式

方式一

import axios from 'axios';
Vue.prototype.$axios = axios;

// 在 .vue 檔案中使用
// 使用 this as any 是去掉 ts 的型別檢測 axios 是掛載成功的
(this as any).$axios.get('http://www.baidu.com').then((res: any) => {
      console.log(res);
    });

方式二

import axios, { AxiosInstance } from 'axios'

declare module 'Vue/types/vue' {
  interface Vue {
    $http: AxiosInstance
  }
}

// 在 .vue 檔案中使用
this.$axios.get('http://www.baidu.com').then((res: any) => {
      console.log(res);
    });
 

方式三

import axios from 'axios';
import VueAxios from 'vue-axios';

Vue.use(VueAxios, axios)

// 在 .vue 檔案中使用
this.$axios.get('http://www.baidu.com').then((res: any) => {
    console.log(res);
});

方式四

// 在 .vue 檔案中直接匯入
import axios from "axios";

axios.get('http://www.baidu.com', {}).then((res: any) => {
    console.log(res);
});
 

後續方式持續補充