Dynamic response

You can export a function instead of an object to resolve a dynamic response, so as to simulate a complex business logic in the real world.

Hit F12 to access Developer Tools and view the console logs.

Mock data file

/**
 * @url https://www.api.com/dynamic-response
 * @method get
 */
let times = 0;
module.exports = (requestInfo) => {
  const { url, query } = requestInfo;
  return { times: 'times: ' + (++times), url, query };
};

---

Vue code

<template>
  <div class="demo">
    <button @click="get">GET https://www.api.com/dynamic-response</button>
    <div class="result"> {{ msg }} </div>
    <div class="tips">Hit F12 to access Developer Tools and view the console logs.</div>
  </div>
</template>

<script>
import axios from 'axios';
export default {
  data() {
    return { index: 0, msg: '' }
  },
  methods: {
    get() {
      axios.get('https://www.api.com/dynamic-response?i=' + (++this.index)).then(res => {
        this.msg = res.data;
      });
    },
  }
}
</script>
<style scoped src="./demo.css">

Request information

export interface RequestInfo {
  url: string;
  method: HttpVerb;
  query: object; // url search query
  headers?: object; // request header
  body?: any; // post body
}