关于mock:vue使用在线mock平台用axios请求示例-不用自己安装mockjs

通常咱们mock数据都会装置mockjs:yarn add mockjs
然而须要配置很多货色,还要拦挡申请等等,对老手不敌对,即便是新手也感觉麻烦。

举荐大家应用useMock 在线Mock助手,我的项目API数据模仿,宣称比外部环境更贴心

  1. 反对团队合作
  2. 灵便解耦
  3. 不局域
  4. 可重复调试
  5. 主动生成文档

Vue申请示例:

你须要先在useMock平台增加你本人的我的项目和接口,而后就会失去接口文档,复制API链接申请就能够获取到在线mock设置的数据了。


以二维码解码接口mock为例:

在线示例Vue:https://www.usemock.com/demo/…


示例图:

<script>
//vue 示例代码
  const App = {
    data() {
      return {
        apiUrl:"https://2weima.usemock.com/api/qrdecode",
        info:null
      }
    },
    methods: {
      onReqApi(){
        // 应用axios发申请
        axios.post(this.apiUrl,{
          qr_image:"https://img.2weima.com/qr_template/2021/6/26/8857784941a0f2d2a024044f414c69f9.jpg"
        })
        .then(response =>{
          this.info = response.data
          console.log('因为跨域申请,在Network中多一个 Request Method: OPTIONS 申请是失常的。')
          console.log('response data:',this.info)
        })
      }
    }
  }

  Vue.createApp(App).mount('#app')

</script>

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理