<span id="mktg5"></span>

<i id="mktg5"><meter id="mktg5"></meter></i>

        <label id="mktg5"><meter id="mktg5"></meter></label>
        最新文章專題視頻專題問(wèn)答1問(wèn)答10問(wèn)答100問(wèn)答1000問(wèn)答2000關(guān)鍵字專題1關(guān)鍵字專題50關(guān)鍵字專題500關(guān)鍵字專題1500TAG最新視頻文章推薦1 推薦3 推薦5 推薦7 推薦9 推薦11 推薦13 推薦15 推薦17 推薦19 推薦21 推薦23 推薦25 推薦27 推薦29 推薦31 推薦33 推薦35 推薦37視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關(guān)鍵字專題關(guān)鍵字專題tag2tag3文章專題文章專題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專題3
        問(wèn)答文章1 問(wèn)答文章501 問(wèn)答文章1001 問(wèn)答文章1501 問(wèn)答文章2001 問(wèn)答文章2501 問(wèn)答文章3001 問(wèn)答文章3501 問(wèn)答文章4001 問(wèn)答文章4501 問(wèn)答文章5001 問(wèn)答文章5501 問(wèn)答文章6001 問(wèn)答文章6501 問(wèn)答文章7001 問(wèn)答文章7501 問(wèn)答文章8001 問(wèn)答文章8501 問(wèn)答文章9001 問(wèn)答文章9501
        當(dāng)前位置: 首頁(yè) - 科技 - 知識(shí)百科 - 正文

        vue 里面使用axios 和封裝的示例代碼

        來(lái)源:懂視網(wǎng) 責(zé)編:小采 時(shí)間:2020-11-27 22:31:08
        文檔

        vue 里面使用axios 和封裝的示例代碼

        vue 里面使用axios 和封裝的示例代碼:vue官方推薦使用 axios發(fā)送請(qǐng)求 首先上需求 1.需要封裝全局調(diào)用 2.返回一個(gè)promise對(duì)象 3.錯(cuò)誤全局統(tǒng)一處理 4.除了登錄界面token帶入頭部 5.登錄時(shí)候把用戶信息自動(dòng)存到vuex里面 首先上封裝代碼 /** * User: sheyude * Date: 201
        推薦度:
        導(dǎo)讀vue 里面使用axios 和封裝的示例代碼:vue官方推薦使用 axios發(fā)送請(qǐng)求 首先上需求 1.需要封裝全局調(diào)用 2.返回一個(gè)promise對(duì)象 3.錯(cuò)誤全局統(tǒng)一處理 4.除了登錄界面token帶入頭部 5.登錄時(shí)候把用戶信息自動(dòng)存到vuex里面 首先上封裝代碼 /** * User: sheyude * Date: 201

        vue官方推薦使用 axios發(fā)送請(qǐng)求

        首先上需求

        1.需要封裝全局調(diào)用
        2.返回一個(gè)promise對(duì)象
        3.錯(cuò)誤全局統(tǒng)一處理
        4.除了登錄界面token帶入頭部
        5.登錄時(shí)候把用戶信息自動(dòng)存到vuex里面

        首先上封裝代碼

        /**
         * User: sheyude
         * Date: 2017/8/23 0023
         * Time: 下午 13:15
         *
         */
        
        import axios from 'axios';
        // 導(dǎo)入配置文件 配置文件就導(dǎo)入的請(qǐng)求的前綴地址
        import {defaults} from '@/config/'
        
        import storage from './storage'
        
        
        // 這是一個(gè)餓了么的彈框
        import { Message } from 'element-ui';
        //路由配置
        import router from '@/router'
        
        /**
         * 封裝的全局ajax請(qǐng)求
         */
        
        class Axios{
         constructor (){
         this.init();
         };
        
         /**
         * 初始化
         */
         init(){
         axios.defaults.baseURL = defaults.baseURL;
         };
         _setUserInfo(data){
         // 把請(qǐng)求的數(shù)據(jù)存入vuex
         store.commit('setUserInfo',data);
         }
        
         /**
         * 判斷是否是登錄
         * @param url
         * @returns {boolean}
         * @private
         */
         _isLogin(url){
         
         if(url != '/app/login'){
         axios.defaults.headers = {'x-token': store.state.user.user.token.token};
         return false;
         }else{
         return true;
         }
         }
        
         /**
         * 判斷是否返回?cái)?shù)據(jù)
         * @param data 接收到的數(shù)據(jù)
         * @returns {boolean}
         * @private
         */
         _isStatus(data){
         if(data.code == 100){
         router.push('/login');
         Message.error(data.message || '請(qǐng)重新登錄!');
        
         return false
         }else{
         return true
         }
        
         }
        
         /**
         * 全局錯(cuò)誤處理
         * @param data 傳入錯(cuò)誤的數(shù)據(jù)
         * @private
         */
         _error(data){
         console.log(data)
         Message.error('網(wǎng)絡(luò)錯(cuò)誤!');
         }
        
         /**
         * GET 請(qǐng)求 {es6解構(gòu)賦值}
         * @param type 包含url信息
         * @param data 需要發(fā)送的參數(shù)
         * @returns {Promise}
         * @constructor
         */
         HttpGet({url},data) {
         console.log(data)
         // 創(chuàng)建一個(gè)promise對(duì)象
         this._isLogin(url)
         this.promise = new Promise((resolve, reject)=> {
         axios.get(url,{params:data})
         .then((data) => {
         // console.log(data)
         if(this._isStatus(data.data)){
         resolve(data.data);
         }
         })
         .catch((data) =>{
         this._error(data);
         })
         })
         return this.promise;
         };
        
         /**
         * POST 請(qǐng)求
         * @param type Object 包含url信息
         * @param data Object 需要發(fā)送的參數(shù)
         * @param urlData Object 需要拼接到地址欄的參數(shù)
         * @returns {Promise}
         * @constructor
         */
         HttpPost({url},Data,urlData){
        
         // 判斷是否加頭部
         this._isLogin(url);
         // 創(chuàng)建一個(gè)promise對(duì)象
         this.promise = new Promise((resolve, reject)=> {
         for(const item in urlData){
         url += '/' + urlData[item];
         };
         axios.post(url,Data)
         .then((data) => {
        
         // 是否請(qǐng)求成功
         if(this._isStatus(data.data)){
         // 是否需要存數(shù)據(jù)
         if(this._isLogin(url)){
         this._setUserInfo(data.data)
         };
         resolve(data.data)
         };
         })
         .catch((data) =>{
         this._error(data);
         })
         })
         return this.promise;
         };
        };
        export default new Axios();
        
        

        調(diào)用方式

        this.$axios.HttpPost(this.audit.auditGet,this.params)
         .then((data) => {
         this.pageData = data.data
         })
        
        

        接收2個(gè)參數(shù)

        1 url 地址
        2 需要傳遞的參數(shù)

        我目前全局注冊(cè)了 使用需要掛載到vue原型

        聲明:本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí),若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系,我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

        文檔

        vue 里面使用axios 和封裝的示例代碼

        vue 里面使用axios 和封裝的示例代碼:vue官方推薦使用 axios發(fā)送請(qǐng)求 首先上需求 1.需要封裝全局調(diào)用 2.返回一個(gè)promise對(duì)象 3.錯(cuò)誤全局統(tǒng)一處理 4.除了登錄界面token帶入頭部 5.登錄時(shí)候把用戶信息自動(dòng)存到vuex里面 首先上封裝代碼 /** * User: sheyude * Date: 201
        推薦度:
        標(biāo)簽: VUE 使用的 封裝
        • 熱門(mén)焦點(diǎn)

        最新推薦

        猜你喜歡

        熱門(mén)推薦

        專題
        Top
        主站蜘蛛池模板: 国产色在线|亚洲| 亚洲综合色丁香麻豆| 亚洲AV无码一区二区大桥未久| 99在线观看免费视频| 亚洲精品亚洲人成人网| 成人免费一区二区三区| 精品亚洲视频在线观看| 久久久久国色AV免费观看| 亚洲国产成人高清在线观看| 中文成人久久久久影院免费观看| 亚洲中文字幕无码中文字在线| 中文字幕免费观看全部电影| 亚洲av中文无码乱人伦在线播放 | 小说专区亚洲春色校园| 国产一区二区免费在线| 成人福利在线观看免费视频| 青青草原亚洲视频| 午夜无码A级毛片免费视频 | 成人一级免费视频| 亚洲国产AV无码专区亚洲AV| 9277手机在线视频观看免费| 亚洲乱码在线播放| 免费无遮挡无码永久在线观看视频| 黄色三级三级三级免费看| 亚洲日韩中文无码久久| 亚洲国产精品免费观看| 性色av极品无码专区亚洲 | 亚洲一区电影在线观看| 国产成人免费永久播放视频平台 | 国产精品无码免费视频二三区| 一级中文字幕乱码免费| 久久精品亚洲一区二区三区浴池| 国产在线观看免费观看不卡| 美女啪啪网站又黄又免费| 亚洲国产精品无码专区在线观看| 国产精品免费观看久久| 国产日韩精品无码区免费专区国产| 亚洲成a人片在线观看中文动漫| 四虎永久在线精品免费网址| 国产精品内射视频免费| 亚洲一区无码中文字幕乱码|