vue项目中使用axios发送请求

在src下新建一个server的文件夹，文件夹中的文件是server.js文件

server.js文件中写：

import {

Message

} from 'element-ui';

let BASEURL = '';

if (process.env.NODE_ENV === 'development') {

BASEURL = '接口文档中的总路径';

}else {

BASEURL = '接口文档中的总路径';

}

let axios = require('axios') ;

axios.defaults.baseURL = BASEURL ;

// 处理统一错误提示

function atAxios(option) {

axios[option.type.toLowerCase()](option.url, option.params).then((v) => {

if (v.data.status !== 0) {

if (option.error) option.error();

Message({

message: v.data.msg,

type: 'error',

center: true

})

} else {

// console.log(v.data)

option.success(v);

}

}).catch((v) => {

if (option.error) option.error();

Message({

message: v.toString(),

type: 'error',

center:true

})

}

export {

atAxios,

BASEURL

}

2.在要发送请求的文件中，script标签里引入：import { atAxios } from '../../server/server';

atAxios({

url: ‘’, //请求的地址变量可以用${self.schoolid},引号要用反引号，就是数字1旁边的键

type:"GET", //get方式

success(v) {

// self.tableData = v.data.classAll;

atAxios({

url:`zhima/school/getTeacherAll?schoolId=${self.$store.state.schoolId}`,

type:"GET",

success(request) {

//成功以后的函数

})

3.post请求

atAxios({

url:'请求地址',

type:"POST",

params:{

//请求参数

success(v) {

//成功函数

}

})

vue项目中使用axios发送请求相关推荐

vue php axios 跨域,在vue项目中,使用axios跨域处理
下面我就为大家分享一篇在vue项目中,使用axios跨域处理,具有很好的参考价值,希望对大家有所帮助. 跨域,一个很是让人尴尬的问题,有些人可以在后台中设置请求头,但是很多前端并不具备后台的知识,并无 ...
Vue学习笔记（二）—— vue项目中使用axios
一.文档链接 axios文档 vue开发插件二.axios 简介 axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端,它本身具有以下特征: 从浏览器中创建 XML ...
vue-cli3.x中使用axios发送请求,配合webpack中的devServer编写本地mock数据接口(get/post/put/delete)...
vue-cli3.x中使用axios发送请求,配合webpack中的devServer编写本地mock数据接口(get/post/put/delete) 手把手式笔记 Axios配置安装 axios ...
在vue项目中对axios进行封装
在vue项目中对axios进行封装 1.引入axios,qs模块 import axios from 'axios'; import Qs from "qs"; import st ...
超级详细的教程一步步教你Vue项目中使用axios如何进行参数拼接
文章目录一.Vue 中的网络请求二.axios的引入三.常用网络请求方式 1.get A.字符串拼接方式: B.通过params属性传递对象: C.路径拼接方式: D.无请求参数: 2.post ...
Vue项目中使用axios如何进行参数拼接
一.Vue 中的网络请求在Vue.js中发送网络请求本质还是Ajax,我们可以使用插件方便操作. ①vue-resource:Vue.js的插件,已经不维护,不推荐使用. ②axios:不是vue的 ...
Vue安装并使用axios发送请求
前言本文主要介绍的是使用在Vue项目中安装并使用axios发送请求 axios介绍 axios是一种Web数据交互方式它是一个基于promise的网络请求库,作用于node.js和浏览器中,它是 ...
在vue项目中使用axios封装axios
基本使用安装 // 项目中安装 npm install axios --S // cdn 引入 <script src="https://unpkg.com/axios/dist/a ...
vue商城项目开发：axios发送请求及列表数据展示
使用axios发送get请求先install一下axios: 在main.js中全局引入axios: 仅仅在main.js中引入axios不会生效: 第二种解决方法如下,也是最常用的: 使用$htt ...

vue项目中使用axios发送请求

vue项目中使用axios发送请求相关推荐

最新文章

热门文章