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

通常我们mock数据都会安装mockjs：yarn add mockjs
但是需要配置很多东西，还要拦截请求等等，对新手不友好，即使是老手也觉得麻烦。

推荐大家使用useMock 在线Mock助手，项目API数据模拟，声称比内部环境更贴心

1. 支持团队协作
2. 灵活解耦
3. 不局域
4. 可反复调试
5. 自动生成文档

官网：https://www.usemock.com/

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>