vue2.0之axios使用详解(二)

作者：笔触狂放9 | 2024-08-19 08:36:40

踩

vue2.0之axios使用详解(二)

发了vue2.0之axios使用详解(一)后，有朋友问如何在实际项目中使用，下面把我平常用的两种方法分享下，自己在实际项目中总结的方法，有不好的地方还请指正，共同提高，谢谢！

[javascript]view plaincopy 
   
 方法一:直接在.vue文件中引入使用  
   
 在.vue文件中使用  
 <script>  
   import axios from 'axios';  
   export default {  
     name: 'news',  
     data () {  
       return {  
       }  
     },  
     methods: {  
       getNewsFn(){  
         axios.get(this.dataURL + '/getNews').then((news) => {  
             this.news = news.data;  
           }  
         ).catch((err) => {  
             console.log(err);  
           }  
         );  
       }  
     }  
   }  
 </script>  
   
   
 方法二:注册为全局的函数  
   
 首先在main.js文件中引入  
 import axios from '../node_modules/axios';  
   
 Vue.prototype.axios = axios;  
   
 new Vue({  
   el: '#app',  
   router,  
   store,  
   axios,  
   echarts,  
   template: '<App/>',  
   components: { App }  
 });  
 其次在.vue文件中使用  
   defaultData(){  
         let _this = this;  
         _this.axios.get('http://' + _this.$store.state.defaultHttp + '?action_type=comp_news&comp_id=' + _this.$store.state.compValue + '&offset=0&len=' + _this.pageNum, {}, {  
             headers: {}  
         }).then(function (response) {  
               
         }).catch(function (response) {  
             console.log(response);  
         });  
     }          

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/笔触狂放9/article/detail/1001537