Blogger Information
Blog 1
fans 0
comment 0
visits 607
Related recommendations
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
Vue axios封装
Rind
Original
607 people have browsed it

根目录打开src目录创建request文件夹

创建两个文件http.js、api.js

http.js

  1. import axios from 'axios'
  2. // 环境的切换
  3. if (process.env.NODE_ENV === 'development') {
  4. axios.defaults.baseURL = 'http://192.168.3.5:8084/'
  5. } else if (process.env.NODE_ENV === 'debug') {
  6. axios.defaults.baseURL = 'http://192.168.3.5:8084/'
  7. } else if (process.env.NODE_ENV === 'production') {
  8. axios.defaults.baseURL = 'http://192.168.3.5:8084/'
  9. }
  10. axios.defaults.timeout = 10000
  11. axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8;multipart/form-data'
  12. /**
  13. * get方法,对应get请求
  14. * @param {String} url [请求的url地址]
  15. * @param {Object} params [请求时携带的参数]
  16. */
  17. export function get (url, params) {
  18. return new Promise((resolve, reject) => {
  19. axios.get(url, {
  20. params: params
  21. }).then(res => {
  22. resolve(res.data)
  23. }).catch(err => {
  24. reject(err.data)
  25. })
  26. })
  27. }
  28. /**
  29. * post方法,对应post请求
  30. * @param {String} url [请求的url地址]
  31. * @param {Object} params [请求时携带的参数]
  32. */
  33. export function post (url, params) {
  34. return new Promise((resolve, reject) => {
  35. axios.post(url, params)
  36. .then(res => {
  37. resolve(res.data)
  38. })
  39. .catch(err => {
  40. reject(err.data)
  41. })
  42. })
  43. }

api.js

  1. //引入http.js
  2. import { get, post } from './http'
  3. //请求地址http://192.168.3.5:8084/exam/question
  4. //http://192.168.3.5:8084/在http.js已定义
  5. //在api.js只需要接口就行了
  6. export const api = p1 => get('exam/question', p1)

在需要使用的页面引入import {api} from ‘@/request/api’;

{内可以多个}

  1. api({
  2. //参数
  3. }).then(res => {
  4. //成功返回
  5. })
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post