vue vant-ui写h5：axios+Toast+Notify封装

import axios from "axios";
import { Toast, Notify } from "vant";

/* base config */
const serve = axios.create(
    {
        baseURL: `https://cnodejs.org/api/v1`,
        timeout: 10*1000,
        headers: {
            "Cache-Control": "no-cache" /* clear storage */,
            Pragma: "no-cache",
        }
    }
)

/* if error */ 
const error = (err) => {
    Notify(
        {
            type: `danger`,
            message: err || `系统报错,请反馈管理员`
        }
    )
}

/* if loading */
let loading = Toast.loading(
    {
        duration: 0,
        forbidClick: true,
        loadingType: `spinner`,
        overlay: false,
        message: `加载中...`
    }
)

/* show loading */
const startLoading = () => {
    loading ;
}

/* close loading */ 
const endLoading = () => {
    loading.clear()
} 

/* interceptors request */ 
serve.interceptors.request.use(
    config => {
        startLoading();
        return config;
    },
    err => {
        endLoading();
        error();
        Promise.reject(err)
    }
)

/* interceptors responece */ 
serve.interceptors.response.use(
    config => {
        endLoading();
        return config;
    },
    err => {
        endLoading();
        error();
        Promise.reject(err)
    }
)

/* be imported */ 
export default serve;

加载背景色修改：

/* toast css */
div.van-toast {
  background-color: transparent;
  color: #2c3e50;
  background-color: rgba($color: #000000, $alpha: 0);
  div.van-toast__loading {
    .van-loading__spinner--spinner i::before {
      background-color: #2c3e50;
    } 
  }
}

标签：Toast,loading,vant,err,color,interceptors,axios,config
来源： https://www.cnblogs.com/herotxl/p/15662457.html