Vue中常见的api接口写法：

1.axios中data与params的区别:

【1】params

params是添加到url的请求字符串中的

【2】data

data是添加到请求体（body）中的

【3】

注:具体用哪种,看后端接口吧

2、拼接URL：

接口：GET 	/dictList/{id}

export function dictType(type){
	return request({
		url:'/api/dictList/'+id,//情况一
		//url:'/api/'+{id}+'/dictList/',//情况二
		method:'get'
	})
}

3、没有请求参数：

接口：GET 	/dataList

export function dictType(){
	return request({
		url:'/api/dataList',
		method:'get'
	})
}

4、有请求参数：

接口：POST /upload

export function getUpload(obj) {
	return request({
    	url: '/api/upload',
    	method: 'post',
    	//data: obj,
    	params: obj,
 	})
}

5.请求数据类型为:X-WWW-FORM-URLENCODED

export function getUpload(obj) {
	return request({
    	url: '/api/upload',
    	method: 'post',
    	data: obj,
    	headers: {
            'Content-Type': 'X-WWW-FORM-URLENCODED;charset=UTF-8',
        }
 	})
}

6.请求数据类型为:application/json

export function getUpload(obj) {
	return request({
    	url: '/api/upload',
    	method: 'post',
    	data: obj,
    	headers: {
            'Content-Type': 'application/json;charset=UTF-8',
        }
 	})
}

7.请求数据类型为:FORM-DATA

export function getUpload(obj) {
	return request({
    	url: '/api/upload',
    	method: 'post',
    	data: obj,
    	headers: {
            'Content-Type': 'multipart/FORM-DATA;charset=UTF-8',
        }
 	})
}

8.请求数据类型为:responseType (导出execl文件)

export function getUpload(obj) {
	return request({
    	url: '/api/upload',
    	method: 'post',
    	data: obj,
    	responseType: 'blob'
 	})
}

9.下载文件

/**
 * 下载文件
 * @param url 文件路径
 * @param fileName 文件名
 * @param param参数
 * @returns {*}
 */
export function downloadFile(url, fileName, param) {
    return downFile(url, param).then((data) => {
        if (!data || data.size === 0) {
            Vue.prototype['$message'].warning('文件下载失败')
            return
        }
        if (typeof window.navigator.msSaveBlob !== 'undefined') {
            window.navigator.msSaveBlob(new Blob([data]), fileName)
        } else {
            let url = window.URL.createObjectURL(new Blob([data]))
            let link = document.createElement('a')
            link.style.display = 'none'
            link.href = url
            link.setAttribute('download', fileName)
            document.body.appendChild(link)
            link.click()
            document.body.removeChild(link) //下载完成移除元素
            window.URL.revokeObjectURL(url) //释放掉blob对象
        }
    })
}

10.【Vuex+localStorage】登录时获取token并封装api接口：