封装axios请求

一般的Vue项目中需要封装axios请求。

首先在主项目中使用命令行$ npm install axios下载axios

创建request.js

    // 引入axios
    import axios from 'axios'

    export function get(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 get({
        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>