在React项目中使用Mock制造假数据

使用Mock制造假数据

话不多说，直接上代码

import Mock form 'mockjs'		// 引入 Mock, 用于制造假数据
import moment from 'moment'		// 引入 moment, 用于对时间进行处理

let fakeData = Mock.mock({
	// 一个有123个元素的 list 数组
    'list|123': [
    	// 每个元素为一个对象
        {
        	// +1, 表示自增; 0, 表示初始值
            'index|+1': 0,
            // 1-5, 表示取值范围为 1,2,3,4,5
            'status|1-5': 2,
            // 也可使用数组指定具体哪些值中的一个
            'other_status|1': [0,1,2],
            // ture or false, 初始值为true
            'isDone|1': true
            // mock中允许使用函数, 但注意, 此处不能使用箭头函数, 否则 this 为 undefined
            'id|1': function() {
				// 函数中可以使用 this 来使用对象的属性
                if (this.index >= 0 && this.index < 10) {
                    return `testId000${this.index + 1}`;
                }
                if (this.index >= 10 && this.index < 100) {
                    return `testId00${this.index + 1}`;
                }
                return `testId0${this.index + 1}`;
            },
            'time|1': function() {
            	// 模拟时间
            	return moment().subtract(this.index,'d').format('YYYY-MM-DD HH:mm:ss')
            	},
            // 可以使用正则表达式, 如下, 模拟电话号码
            'phone|1': /(13[0-9]|15[012356789]|166|17[3678]|18[0-9]|14[57])[0-9]{8}$/,
        },
    ],
});
// list 中才是真正的数据
const { list } = fakeData;

ps: 觉得有收获的话，不妨给我点个赞(｀・ω・´)；如有问题，还请指出，我会及时查看，一起学习，一起进步~