<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
        主站蜘蛛池模板: 成人网站免费大全日韩国产| 免费h视频在线观看| 久久精品国产亚洲5555| 久操免费在线观看| 亚洲国产乱码最新视频| 亚洲色婷婷综合开心网| 免费成人福利视频| 有码人妻在线免费看片| 亚洲免费视频播放| 亚洲男人在线无码视频| 国产精品成人观看视频免费| 免费无码专区毛片高潮喷水| 久久精品国产亚洲av影院| 波多野结衣免费视频观看| 人妻无码一区二区三区免费| 色费女人18女人毛片免费视频 | 亚洲国产中文v高清在线观看| 免费一区二区三区| 色妞www精品视频免费看| 亚洲毛片免费视频| 久久久久国产亚洲AV麻豆 | 亚洲а∨天堂久久精品| 37pao成人国产永久免费视频| 黄色a级片免费看| 亚洲中文字幕一区精品自拍| 在线亚洲人成电影网站色www| 噜噜嘿在线视频免费观看| 久久国产乱子伦精品免费一 | 国产亚洲福利在线视频| 婷婷亚洲综合五月天小说| 亚洲国产V高清在线观看| 成人午夜18免费看| 99久久人妻精品免费二区| 国产免费内射又粗又爽密桃视频| 亚洲综合无码一区二区痴汉| 亚洲国产成人久久综合一| 中文字幕亚洲综合久久男男| 成人免费无码大片a毛片软件| 亚欧人成精品免费观看| 四虎国产成人永久精品免费| 999zyz**站免费毛片|