014前端数据模拟

发布时间:2024年01月24日

MOCK
只是在前端开发阶段用到
基于需要的数据格式生产字段

指定拦截请求,然后返回数据格式
需要安装axios,mockjs

import Mock from 'mockjs'

Mock.mock('/product/search',{
    "ret":0,
    "data":
    {
        "mtime": "@datetime",
        "score|1-800":1,
        "rank|1-100":1,
        "stars|1-5":1,
        "nickname":"@cname",
        "img":"@image('200x100','#ffcc33','#FFF','png','Fast Mock')"
    }
});
<template>
  <div id="app">
    <img alt="Vue logo" :src="img">
  </div>
</template>

<script>
import axios from 'axios'

export default {
  name: 'App',
  data:function(){
    return{
      img:""
    }
  },

  mounted:function(){
    axios.get("/product/search").then(res=>{
      console.log(res.data.data.img)
      this.img = res.data.data.img
    })
  }
}
</script>

数据模版
“属性名字|规则”:value
查官方文档
例如
‘name|min-max’:string
重复输出字符串,吃饭次数结余min-max
var data = Mock.mock({
‘name|1-3’:‘a’, 1到3次
})

还要很多@date类型的数据

文章来源:https://blog.csdn.net/z3502603706/article/details/135756662
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。