美文网首页
Vue 集成 Mockjs

Vue 集成 Mockjs

作者: Passon_Fang | 来源:发表于2019-04-12 15:50 被阅读0次

    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);
          });
    

    相关文章

      网友评论

          本文标题:Vue 集成 Mockjs

          本文链接:https://www.haomeiwen.com/subject/clwcwqtx.html