vue 设置多个反向代理以及easy-mock的简单的使用方法

下载vue官方的脚手架，打开的文件config／index.js

    proxyTable: {
      sencod: {
        target: 'https://cnodejs.org/',     //从网上趴的接口的
        filter(pathname, req) {
          // console.info('pathname',pathname)
          const isApi = pathname.indexOf('/api') == 0;   //这里的abc是和后台商量好=>api
          const ret = isApi;
          return ret;
        },
        changeOrigin: true,
      },
      three: {
        target: ' https://easy-mock.com/mock/59d78f3b9d342f449f2fed3a/', //后面介绍这个接口
        filter(pathname, req) {
          // console.info('pathname',pathname)
          const isApi = pathname.indexOf('/baseapi') == 0;   //这里的abc是和后台商量好=>baseapi
          const ret = isApi;
          return ret;
        },
        changeOrigin: true,
      },
    },

//组件中调用

methods: {
      getData() {
        axios.get('/api/v1/topics', { //cnodejs的接口
          params: {
            page: 20,
            limit: 10
          }
        })
          .then(function (response) {
            //console.log(response);
          })
          .catch(function (error) {
            //console.log(error);
          });
      },
      getDatathree() {
        axios.get('/baseapi/table') //easy-mock的模拟出来的接口
          .then(function (response) {
            console.log(response);
          })
          .catch(function (error) {
            console.log(error);
          });
      }
    },

• 介绍的easy-mock的使用方法
  
  1. 自己注册一个账号进来
  2. 点击右下角的 + 的符号创建项目
  3. 
  4. 对应的baseapi的关系就是这样，为什么选择easy-mock的方式，就是自己写接口，不用习惯性的写成api的方法
  5. 创建接口的
     
     

详细的教学方法，easy-mock的文档都是有的，掌握的这个easy-mock非常方便获取的数据。