Vuejs实战项目五:数据列表

1、在EasyMock 中添加数据列表模拟接口

请求url:/suyuan/list

请求方式:get

描述:数据列表

mock.js配置:

例:

{
  "code": 2000, //状态码
  "flag": true,
  "message": "查询成功",
  "data|20": [{
    "id|+1": 10,
    "cardNum": "@integer(10000)", //大于1000的正整数
    "name": "@cname",
    "birthday": "@date",
    "phone|11": "@integer(0,9)", //11个数字0-9间的数字
    "integral": "@integer(0,500)",
    "money": "@float(0, 1000, 1, 3)", //0-1000小数,1-3位小数位
    "payType|1": ['1', '2', '3', '4'], //4选1
    "address": "@county(ture)"
  }]
}

2、创建api调用接口

在/src/api下创建member.js

import request from '@/utils/request'


export default {
    // 获取会员列表数据
    getList(){
        return request({
            url: '/member/list',
            method: 'get',
        })
    }
}

3、编辑对应的展示页面



 

转载于:https://www.cnblogs.com/flypig666/p/11595939.html

你可能感兴趣的:(Vuejs实战项目五:数据列表)