Vue前后端交互

环境：
前端：Vscode开发
后端：IDEA开发

1.（Vue.js 2.0 版本推荐使用 axios 来完成 ajax 请求）
安装axios

在终端执行：npm install axios

Vue前后端交互（vue2）_ajax


2.修改config/index.js文件

在proxyTable节点添加：

'/user':{
        target:'http://localhost:9081',
        changeOrigin:true,
      }

Vue前后端交互（vue2）_ios_02


其中：

1./user是后端统一接口路径

2.target是我们要映射的地址

3.封装请求：
创建src/util/login.js
写入：

import axios from 'axios'

export function login () {
  return axios.request({
    url: '/user/login',
    method: 'get'
  })
}

4.在调用的页面引入方法：

import { login } from '@/util/login'

Vue前后端交互（vue2）_ios_03


调用：

login().then(res => {
        console.log(res)
      }).catch(err => {
        console.log(err)
      })

Vue前后端交互（vue2）_ios_04


测试：

Vue前后端交互（vue2）_交互_05