一般的Vue项目中需要封装axios请求。
首先在主项目中使用命令行
$ npm install axios
下载axios
创建request.js
// 引入axios
import axios from 'axios'
export function axiosrequest(config){
// 进行基础配置
const instance = axios.create({
baseURL:'http://localhost:3000/',
timeout:10000
})
return instance(config)
}
在这里封装axios的基础配置
创建home.js
import {get} from './request'
export function homeMultidata(){
return axiosrequest({
url:'posts/1',
})
}
进行更加详细的页面配置,可以创建多个类似home.js
的细分配置文件,它们共同拥有request.js
的基础配置
创建test.vue
<template>
</template>
<script>
//获取 home.js 中的 homeMultidata
import {homeMultidata} from './home'
created(){
homeMultidata().then(res => {
// 获取到的res来自 http://localhost:3000/posts/1
this.banner = res.posts
this.recommend = res.posts
})
}
</script>
<style>
</style>