精华内容
下载资源
问答
  • mockjs

    2021-10-16 21:27:40
    文章目录官网文档地址示例 官网 :http://mockjs.com/ 文档地址 https://github.com/nuysoft/Mock/wiki/Getting-Started 示例 http://mockjs.com/examples.html
    展开全文
  • MockJs

    2020-08-14 10:11:59
    MockJs 介绍:https://www.jianshu.com/p/d812ce349265 vue使用参考:https://www.cnblogs.com/zxuedong/p/13112029.html 官网示例:http://mockjs.com/examples.html#Date 官方文档:...

    MockJs

    介绍:https://www.jianshu.com/p/d812ce349265

    vue使用参考:https://www.cnblogs.com/zxuedong/p/13112029.html

    官网示例:http://mockjs.com/examples.html#Date

    官方文档:https://github.com/nuysoft/Mock/wiki/Getting-Started

    mockjs 随机函数

    mockjs 模拟请求

    mockjs 模拟带参数请求

    mockjs 拆分模块

    展开全文
  • Mockjs

    2020-08-19 08:59:55
    mockjs 作用 生成随机数据语法 拦截请求 Vue结合mockjs实现 生成随机数据,拦截AJAX请求 模拟后端接口,返回随机数据 比较 采用json数据模拟,生成数据比较繁琐,有局限性 采用mockjs进行模拟数据,模拟各种场景...

    mockjs

    作用

    • 生成随机数据语法
    • 拦截请求
    • Vue结合mockjs实现

    生成随机数据,拦截AJAX请求
    模拟后端接口,返回随机数据

    比较

    • 采用json数据模拟,生成数据比较繁琐,有局限性
    • 采用mockjs进行模拟数据,模拟各种场景(get,post)生成接口,生成所需数据,进行增删改查。

    1.安装mock

    npm install mockjs
    
    //引入mock
    import Mock from 'mockjs'
    //生成文本
    // const data = Mock.mock({
    //   'string|2':"NIHAO"
    // })
    
    // const data = Mock.mock({
    //   'string|1-5':"NIHAO"
    // })
    
    //生成随机字符串 1 个
    // const data = Mock.mock({
    //   string:'@cword(1)'
    //   // string:'@cword(3,10)'
    // })
    
    //生成随机字符串3到10个字符串
    // const data = Mock.mock({
    //   string:'@cword(3,10)'
    //
    // })
    
    //生成标题和句子
    // const data = Mock.mock({
    //   title:'@title',
    //   sentence:'@csentence'
    // })
    
    //生成指定长度的标题和句子
    // const data = Mock.mock({
    //   title:'@ctitle(2,5)',
    //   sentence:'@csentence(30)'
    // })
    
    //以c开头的为随机中文,无c为英文
    // const data = Mock.mock({
    //   title:'@title(2,5)',
    //   sentence:'@sentence(30)'
    // })
    
    //生成随机段落
    // const data = Mock.mock({
    //  content:'@cparagraph(5)'
    // })
    
    //生成随机数字
    // const data = Mock.mock({
    //  'number|1-100':10
    // })
    
    //生成随机增量
    // const data = Mock.mock({
    //   id:'@increment(1)'
    // })
    
    
    //生成姓名-地址-身份证号
    //+true 陕西省 渭南市
    //不加true 渭南市
    // const data = Mock.mock({
    //   name:'@cname()',
    //   idCard:'@id()',
    //   address:'@city(true)'
    // })
    
    //生成图片
    //参数1:图片大小
    //参数2:图片背景色
    //参数3:文本颜色
    //参数4:图片类型
    //参数5:文本关键字
    // const data = Mock.mock({
    //   img_url:"@image('250x250','#ffa074','#f40','png','周迅')"
    // })
    
    
    //生成时间
    // const data = Mock.mock({
    //   date:'@date(yyyy-MM-dd hh:mm:ss)'
    // })
    
    //生成数组
    // const data = Mock.mock({
    //    'list|8-30':[
    //      {
    //        name:'@cname()',
    //        address:'@city(true)',
    //        id:'increment(1)'
    //      }
    //   ]
    // })
    // console.log(data)
    
    //定义get请求
    //参数1:请求接口地址
    //参数2:请求方式
    //参数3:返回数据
    // Mock.mock('/api/news','get',{
    //   status:200,
    //   msg:'获取数据成功'
    //
    // })
    
    //定义拦截POST请求
    // Mock.mock('/api/news','post',{
    //   status:200,
    //   msg:'获取数据成功'
    // })
    //
    // Mock.mock('/api/post/news','post',()=>{
    //   return{
    //     status:200,
    //     msg:'post成功'
    //
    //   }
    // })
    
    展开全文
  • mockJS

    2019-12-21 21:37:17
    mockjs:模拟数据 安装方式 cnpm install mockjs -S yarn add mockjs 引入 const Mock=require("mockjs") 创建接口 //在index.js中使用 const Mock=require("mockjs"); const url=require("url"); const ...

    mockjs:模拟数据

    安装方式

    1. cnpm install mockjs -S
    2. yarn add mockjs

    引入

    • const Mock=require("mockjs")
      
      
      

    创建接口

    • //在index.js中使用
      const Mock=require("mockjs");
      const url=require("url");
      const data=Mock.mock({
        "data|20":[//创建一个date里面有20条数据
          {
            "id|+1":1,  //id从1开始自增1
            "username":"@name",  //生成name数据
            "tel":"/^1(3|5|7|8|9)\d{9}$/", //生成电话号
            "urlPic":"@image('200X200','#css','#fff','Alley')", //生成一个200X200背景颜色为#css字体颜色为#fff,内容为Alley的图片
            "address":"@county(true)",//生成一个地址
            "time":"@now()",//生成一个时间戳
            "text":"@cparagraph()"
          }
          
        ]
      })
      

    Mock.mock()请求数据库中的数据

    • 参数1:请求的地址

    • 参数2:请求的类型(小写)

    • 参数3:回调

    • Mock.mock(/\users\list/,"get",(options)=>{
        return options
      })
      
    • //解析请求

      Mock.mock(/\/users\/list/,"get",(options)=>{
        let {page,limit}=url.parse(options.url,true).query;
        var obj={
          code:200,
          errMeg:"",
          data:{
            list:[]
          }
        }
        
        for(var i=(page-1)*limit;i<Math.min(data,data.length,page*limit);i++){
           obj.data.push(data.data[i]);
        }
        return obj;
      })
      
      
    • 请求
      axios({
        method:"get",
        utl:"/users/list",
        params:{
          page:1,
          limit:10
        }
      })
      
    • //post
      Mock.mock(/\/users\/list/,(options)=>{
        	let {page,limit}=JSON.parse(options.body)
      })
      

    前端请求接口

    • 现在入口文件中引入创建好的mockJS接口

      • import "./mock"
        
    • 然后在需要请求数据的地方写请求

      • axios({
          method:"get",
          url:"/users/list",
          params:{     //post传参时使用data
            
          }
        }).then(data)=>{
          console.log(data);
        }
        
    展开全文

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 7,142
精华内容 2,856
关键字:

mockjs