最近做的项目使用到了ant.design “蚂蚁”框架，https://ant.design/docs/react/getting-started-cn，从中学习了一些知识，现在说其中的一个数组
页面的代码基本都是在js里面写的，开始我们的数组
定义数组
const payList = [{
num: 200, value: 3000
}, {
num: 500, value: 6000
}, {
num: 1000, value: 11000
}, {
num: 2000, value: 18000
}, {
num: 5000, value: 40000
}]
获取数组并循环
{payList.map((v, index) => {
return (
<Col md={12} sm={24} lg={12} xl={12} xxl={8} style={{ marginBottom: '15px' }}>
<div style={{ border: '1px solid #cdcdcd', height: '60px', paddingRight: '0' }}>
<Col span={12}><p style={{ fontSize: '20px', color: '#000000', marginBottom: '0', lineHeight: '60px', textAlign: 'center' }}>{v.num}份</p></Col>
<Col span={12} style={{ background: '#3698fe', padding: '0 0', height: '58px' }}><a href="#/recharge" style={{ fontSize: '14px', color: '#ffffff', textAlign: 'center', width: '100%', height: '100%', display: 'block', }}><p style={{ marginBottom: '0', marginTop: '6px', fontSize: '16px' }}>￥{v.value}</p><p style={{ marginBottom: '0' }}>购买>></p></a></Col>
</div>
</Col>
)
})}
效果图
