zoukankan      html  css  js  c++  java
  • Vue项目封装请求数据的接口总结

     

    以前的惯用做法都是直接在需要的页面写请求数据的接口。但是因为项目中会频繁的请求后台,所以将所有的请求封装起来,方便管理。

    一、配置url(可以放在一个js中)

    1. 引入axios:import axios from “axios”
    2. 配置url

                           const service=axios.create({

                                                     baseURL:请求的地址,

                                                     timeout:5000     //访问超时的时间限制

                          });

    1. 抛出(如果是新起的js文件):export default service;

    二、写接口的文件(js文件)

    1. 将配置url和axios引入:(例如配置的url文件叫request.js)

           2.配置各个接口:(例如叫business.js)

          Get请求:

                         export function testGet(参数){

                                 return request({

                                           method:’get’,

                                           url:’具体接口’,

                                          params:{

                                                 //json格式,如果有就写,没有就去掉。

                                         }

                                })

                       }

         Post请求:

                        export function testPost(参数){

                                    const data={}  //写要传递的参数,json格式

                                    return request({

                                             method:’post,

                                            url:’具体接口’,

                                           datatype:’json’,

                                           data

                                   })

                        }

    三、使用

           1.引入:import   {要引入的方法名字}   from   business.js

           2.使用

                TestGet().then(res=>{  //成功进这个 }).catch(err=>{ //报错进这个});

                放在当前页面使用的方法里。

  • 相关阅读:
    2020 8 17 每日总结
    2020 8 9 每周总结
    2020 8 15 每日总结
    2020 8 13 每日总结
    2020 8 16 每日总结
    2020 811 每日总结
    2020 8 14 每日总结
    图的储存 各种方式的优缺点
    主席树 可持久化线段树基础知识入门详解
    NOIP复赛涉及面最广的知识点简述
  • 原文地址:https://www.cnblogs.com/onesea/p/13282553.html
Copyright © 2011-2022 走看看