| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051 |
- import React, { Component } from 'react';
- import { Carousel, WingBlank } from 'antd-mobile';
- import './Slide.css'
- class Slide extends React.Component {
- constructor(props){
- super(props)
- this.state = {
- imgHeight: 176
- }
- }
- render() {
- return (
- <WingBlank>
- <Carousel
- autoplay={true}
- infinite
- slideWidth={1}
- beforeChange={(from, to) => {}}
- afterChange={index => {}}
- >
- {this.props.slide.map(item => (
- <a
- key={item.toString()}
- href="http://www.alipay.com"
- style={{ display: 'inline-block', width: '100%', height: this.state.imgHeight }}
- >
- <img
- src={item.img}
- alt=""
- style={{ width: '100%', verticalAlign: 'top' }}
- onLoad={() => {
- // fire window resize event to change height
- window.dispatchEvent(new Event('resize'));
- this.setState({ imgHeight: 'auto' });
- }}
- />
- </a>
- ))}
- </Carousel>
- </WingBlank>
- );
- }
- }
- export default Slide
-
|