vue axios使用delete方法传参

axios有增删改查,相对应的有post,delete,patch,get方法,接下来就来记录下用delete方法遇到的坑


1.封装axios

import Vue from 'vue'
import axios from 'axios'
import {
    
     Message, Loading } from 'element-ui'
import Cookies from 'js-cookie'
import router from '../../router/index'

// Vue.prototype.axios = axios;
// axios.defaults.withCredentials = true;


// Add a request interceptor

let loading  //定义loading变量
function startLoading() {
    
     //使用Element loading-start 方法
    loading = Loading.service({
    
    
        lock: true,
        text: '加载中……',
        background: 'rgba(0, 0, 0, 0.7)'
    })
}
function endLoading() {
    
     //使用Element loading-close 方法
    loading.close()
}
let needLoadingRequestCount = 0
export function showFullScreenLoading() {
    
    
    if (needLoadingRequestCount === 0) {
    
    
        startLoading()
    }
    needLoadingRequestCount++
}

export function tryHideFullScreenLoading() {
    
    
    if (needLoadingRequestCount <= 0) return
    needLoadingRequestCount--
    if (needLoadingRequestCount === 0) {
    
    
        endLoading()
    }
}


//http request 拦截器
axios.interceptors.request.use(
    config => {
    
    
        var token = ''
        if (typeof Cookies.get('webToken') === 'undefined') {
    
    

        } else {
    
    
            token = Cookies.get('webToken')
        }
        config.headers = {
    
    
            'Content-Type': 'application/json'
        }
        if (token != '') {
    
    
            config.headers.Authorization = token;
        }
        showFullScreenLoading()
        return config;
    },
    error => {
    
    
        tryHideFullScreenLoading()
        return Promise.reject(error);
    }
);


//http response 拦截器
axios.interceptors.response.use(
    response => {
    
    
        //当返回信息为未登录或者登录失效的时候重定向为登录页面
        if (response.data.code == '-2' || response.data.msg == '身份认证失败,请重新登录') {
    
    
            router.push({
    
    
                path: "/loginPass",
                query: {
    
     redirect: router.currentRoute.fullPath }//从哪个页面跳转
            })
        }
        tryHideFullScreenLoading()
        return response;
    },
    error => {
    
    
        tryHideFullScreenLoading()
        return Promise.reject(error)
    }
)
export default axios;

2.api.js

import axios from './index'
import domain from './domain'
let baseUrl = domain.domain


export const focusAdd= function (params) {
    
    
  return axios.post(`${
      
      baseUrl}`+"/relation/subscroption", params);
}


export const focusDel = function (params) {
    
    
  return axios.delete(`${
      
      baseUrl}`+"/relation/subscroption", {
    
    data:params});
}

export const wenyangDetail = function (params) {
    
    
  return axios.get(`${
      
      baseUrl}`+"/nation/pattrns/allInfo", {
    
    params});
}

讲真的,现在还不是很理解http协议,这是做了项目总结出来的,delete的时候params和body里都能传参,在params里的话,就和get一样,像这样{params},在body里的时候,要再包一层,像这样{data:params}就ok了。(注:params为传的参数)

猜你喜欢

转载自blog.csdn.net/weixin_44994372/article/details/102700867
今日推荐