使用axios串接API

npm install axios --save

新增一個 server/common 放置共用的header及base URL

// server/commom.js
import axios from 'axios'

const headers = { 'Content-Type': 'application/json' }

export const API = axios.create({
    baseURL: '<http://192.168.2.31:8151/api/>',
		headers: {...headers}
})

定義好規則後,新擇一個JS檔案集中管理API

// server/api.js
import { API } from './common'

export const getHomeBanner = () => {
    try {
        **const data = API.get(
            'home/slider',
        )
        return data
    } catch (err) {
        console.log('!!getHomeBanner', err)
    }
}

axios會還傳一個Promise的方法,需要使用then()來銜接

// components
import { getHomeBanner } from '../server/api'

getHomeBanner().then((res)=> {
    console.log(res)
})

參考:

axios(post, get, ...)解析