标签：Toast loading vant err color interceptors axios config

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

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。