<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
        主站蜘蛛池模板: 日韩版码免费福利视频| 男女一边桶一边摸一边脱视频免费| 免费鲁丝片一级观看| 麻豆国产入口在线观看免费| 亚洲第一区视频在线观看| 亚洲中文字幕无码久久2020| 日本特黄特色AAA大片免费| 最近免费字幕中文大全视频 | 久久精品免费视频观看| 丁香花免费完整高清观看| 亚洲AV无码一区二区三区国产 | 久久精品国产亚洲香蕉| 亚洲色大成网站www久久九| 在线观看视频免费国语| 亚洲AV美女一区二区三区| 一进一出60分钟免费视频| 69视频免费观看l| 亚洲一区二区免费视频| 你好老叔电影观看免费| 免费中文字幕一级毛片| 亚洲一区二区三区精品视频| 破了亲妺妺的处免费视频国产| 精品一区二区三区无码免费直播| 麻花传媒剧在线mv免费观看| 久久亚洲精品视频| 一日本道a高清免费播放| 国产亚洲AV无码AV男人的天堂| 深夜a级毛片免费无码| 亚洲欧洲国产精品香蕉网| 香蕉视频免费在线播放| 国产亚洲精品资源在线26u| 日本人的色道免费网站| 亚洲精品自产拍在线观看动漫| 国产高清对白在线观看免费91| 国产美女精品视频免费观看| 久久综合久久综合亚洲| 久久精品国产免费观看| 精品国产亚洲第一区二区三区| 成人免费在线视频| 亚洲日本中文字幕天天更新| 国产成人A在线观看视频免费|