美文网首页工作生活
玩转Vue_使用axios

玩转Vue_使用axios

作者: 伍陆柒_ | 来源:发表于2019-07-03 16:00 被阅读0次

    进入项目安装axios(npm install axios -S)

    axios配置

    项目中安装axios模块完成后,进行以下配置:
    main.js

    //引入axios
    import Axios from 'axios'
    
    //修改原型链,全局使用axios,这样之后可在每个组件的methods中调用$axios命令完成数据请求
    Vue.prototype.$axios=Axios
    

    get请求

    methods:{
            getData(){
                this.$axios.get('https://www.apiopen.top/journalismApi')
                .then(res=>{
                    console.log(res)//返回请求的结果
                })
                .catch(err=>{
                    console.log(err)
                })
            }
        }
    }
    

    post请求

    axios.post('/user',{
      firstName:'Fred',
      lastName:'Flintstone'
    })
    .then(function(res){
      console.log(res);
    })
    .catch(function(err){
      console.log(err);
    });
    

    Axios拦截器配置

    main.js

    //定义一个请求拦截器
    Axios.interceptors.request.use(function(config){
      console.log('Axios.interceptors.request') //在请求发出之前进行一些操作
      return config
    })
    //定义一个响应拦截器
    Axios.interceptors.response.use(function(config){
      console.log('Axios.interceptors.response')//在这里对返回的数据进行处理
      return config
    })
    

    相关文章

      网友评论

        本文标题:玩转Vue_使用axios

        本文链接:https://www.haomeiwen.com/subject/pkqocctx.html