首先在七牛云存储必定数量的mock图片,好比笔者存储了近千张,方便接下来在代码中使用。
图片的来源能够经过爬取诸如https://unsplash.it/400/800/?random
等网站实现,在此不赘述。
核心步骤就是将图片以数字(如1-1000)为文件名存储到七牛云,而后就能够在代码中经过随机int访问了。
再结合Ant Design的API,构造upload组件的Mock数据fileList以下:javascript
const Mock = require('mockjs') let data = Mock.mock({ 'data|4-8': [ { id: '@id', title: '@title', namespace: 'desctab', content: '@paragraph', isPublish: '@boolean', createTime: '@datetime', 'fileList|1-10': [{ name: '@integer(1,960)', uid: '-@name', url: 'http://xxxxx.xxx.clouddn.com/@name', status: 'done', }], }, ], })
效果以下:java