vue-http-rexsheng验证 HTTP 请求的 Vue.js 插件

联合创作 · 2023-09-29 07:19

vue-http-rexsheng,经过公司多个项目磨合而出,一款优秀的 vue.js 平台的 HTTP 请求插件,支持 npm 安装与页面直接引用 JS。

特性:

  1. 支持 ajax、websocket、jsonp、mock
  2. 支持 npm 安装与页面直接引用 js
  3. 自定义拦截器的任意添加
  4. mock 可自定义策略,mock 请求与生产真实请求分离,一键切换

使用方法:

1、页面直接引用(放在 vue.js 引用之后)

<script src="https://rexsheng.github.io/vue-http-rexsheng/latest/http.js"></script>

页面引用之后,就可以使用全局 Vue.ajax.send(...) 或者页面实例中使用 this.$ajax.send(...)了

2、npm 安装

npm install vue-http-rexsheng --save-dev

npm 安装完后,在入口文件比如'src/main.js'中配置引用

import http from 'vue-http-rexsheng';

Vue.use(http)

代码示例:

<template>
   
</template>
<script>
import Vue from 'vue'
export default {
  name: 'app',
  data () {
    return {
      msg: 'Welcome to Your Vue.js App'
    }
  },
  mounted(){
    this.$ajax.send({
      url:"http://xxxxxxxxxxxxxxxxx/xxxxxxxxxx",
      type:"get"
    }).then((d)=>{
      console.log("success1",d,this.msg)
    }).catch((d)=>{
      console.log("error1",d)
    });
    Vue.ajax.send({
      url:"http://test.http.cn/user/{userId}",
      type:"post",
      data:{
          userId:12
      }
    }).then((d)=>{
      console.log("success2",d,this.msg)
    }).catch((d)=>{
      console.log("error2",d)
    });

  }
}
</script>

 

浏览 7
点赞
评论
收藏
分享

手机扫一扫分享

编辑 分享
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

编辑 分享
举报