Vue 集成 Mockjs

2019-04-12  本文已影响0人  Passon_Fang

0 安装

npm install mockjs

1 创建 Mock

创建文件夹 src/mock, src/mock/json

创建 json 文件 src/mock/json/user.json

{
  "name": "Json",
  "age": 13
}

创建文件 src/mock/mock.js

import Mock from 'mockjs'


// 使用正则表达式匹配代参数的 get 请求  /user?xxxxxx
const user = require('./json/user.json')
Mock.mock(/\/user(|\?\S*)$/, 'get', user)
//Mock.mock('/user', user)

main.js 中引入 Mock

import Vue from 'vue'
import App from './App.vue'

// 引入 Mock
process.env.NODE_ENV === 'development' && require('./mock/mock')

Vue.config.productionTip = false

new Vue({
  render: h => h(App),
}).$mount('#app')

上面设置完成后会自动拦截 mock.js 中设置的接口请求

2 请求接口

    axios
      .get("/user", {
        params: { userId: "12" }
      })
      .then(resp => {
        console.log("resp", resp);
      });
上一篇下一篇

猜你喜欢

热点阅读