定义数组

const dhList = [{

        img:  require("../../assets/img/cp1.jpg"), title: '2019年日历航海王台历', introduce: '2019年海贼王限量版精美桌面台历', exchange: '500链币+1元兑换(50本)', time: '截至日期：20190228'

}, {

        img: require("../../assets/img/cp1.jpg"), title: '2019年日历航海王台历1', introduce: '2019年海贼王限量版精美桌面台历1', exchange: '500链币+1元兑换(100本)', time: '截至日期：20190228'

}, {

        img: require("../../assets/img/cp1.jpg"), title: '2019年日历航海王台历2', introduce: '2019年海贼王限量版精美桌面台历1', exchange: '500链币+1元兑换(50本)', time: '截至日期：20190228'

}]

获取数组并循环

<ul>

{dhList.map((v, index) => {

                                return (

                                    <li style={{ borderBottom: '1px solid #cdcdcd', marginBottom: '20px', paddingBottom: '15px' }}>

                                        <Row className='download-num' gutter={24}>

                                            <Col span={24} style={{}}>

                                                <div style={{}}>

                                                    <Col span={8} style={{ width: '160px' }}><img src={v.img} alt="" style={{ width: '100%', display: 'block' }} /></Col>

                                                    <Col span={14}>

                                                        <p style={{ marginBottom: '0px', fontSize: '18px', color: '#595959' }}>{v.title}</p>

                                                        <p style={{ marginBottom: '0px', color: 'rgba(0, 0, 0, 0.65)' }}>{v.introduce}</p>

                                                        <p style={{ marginBottom: '0px', fontSize: '20px', color: '#3698fe' }}>{v.exchange}</p>

                                                        <p style={{ marginBottom: '0px', color: 'rgba(0, 0, 0, 0.65)' }}>{v.time}</p>

                                                        <p style={{ marginTop: '10px' }}>

                                                            <a href="#/setting/exchange-details" style={{ border: '1px solid #cdcdcd', color: 'rgba(0, 0, 0, 0.65)', padding: '5px 15px', borderRadius: '3px', marginRight: '15px' }}>详情</a>

                                                            <a href="#/recharge" style={{ border: '1px solid #f4aa14', background: '#f4aa14', color: '#ffffff', padding: '5px 15px', borderRadius: '3px' }}>兑换</a>

                                                        </p>

                                                    </Col>

                                                </div>

                                            </Col>

                                        </Row>

                                    </li>

                                )

                            })}

</ul>

效果图