zoukankan      html  css  js  c++  java
  • 使用json-server创建mock数据

    json-server的作用就是在不需要后端提供接口的情况下,自行搭建json服务器。

    写mock数据首先就是要会写接口文档,才能写json数据。我们先说如何使用json-server;

    json-server没有办法配置api;

    1. npm中搜索json-server用法

    npm i json-server -g json-server命令提示

    2. 暴露json数据

    ```
    var poslist = require('./polist.json')
    module.exports = function(){
    return {
    list:poslist
    }
    }
    ```
    3. json-server ./static/mock/mock.js 9000 json数据和端口号

    显示url来访问json数据;此时可以手动修改url可以查看到json文件;

    mock.js:
    ```
    挂载数据:
    componentDidMount(){
      fetch('/api/position/list') //当前请求的路径
      .then((response)=>response.json())
      then((res)=>{
      this.data.list = res.data.subjects
     })
    }
    遇到api时候跳转到目标路径,需要在node_module中找到react-script进行配置跨域:
    proxyTable:{
    '/api':{
    target:'http://localhost:9000',//自己配置的url,
    changeOrigin:true,
    <!-- pathRewrite:{//将/api从url中去掉;接口最好加api,因为知道他是个接口;
    '^/api':''
    } -->
    }
    
    }


    此时访问的路径只能是/api/list,而且是利用pathRewrite的方法;而在暴露接口的时候不支持'/',而他支持list.jsp的方式,因此可以配置路由:

    因此配置jsonserver的路由:
    router:{
    '/api/position/list':'/list' //配置路由进行跳转,不是vue路由
    }
    ```

    假如你只配置/api/list就不需要配置上面的路由了。




  • 相关阅读:
    概率统计(DP)
    iOS中几种定时器
    微信开发笔记——微信网页登录授权,获取用户信息
    swift中通知的使用
    Swift的基础,操作符,字符串和集合类型
    NSNotificationCenter
    IOS中通知中心(NSNotificationCenter)的使用总结
    Swift观察者模式
    swift中通知的使用
    Swift
  • 原文地址:https://www.cnblogs.com/naniandongzhi/p/9297744.html
Copyright © 2011-2022 走看看