[day07] react使用轮播图组件

2019-03-26  本文已影响0人  异度世界2

使用react-slick写轮播图效果

组件官网:https://react-slick.neostack.com/

image

import React, {Component} from 'react';

// 引入轮播图组件

import Slider from 'react-slick';

export default class Categroy extends Component {

render () {

var settings = {

dots: true,

infinite: true,

speed: 500,

slidesToShow: 1,

slidesToScroll: 1,

autoplay: true,

};

return (

<div>

<Slider {...settings}>

<div>

<h3>第一屏</h3>

{/* <span>测试按钮</span> */}

</div>

<div>

<h3>第二屏</h3>

</div>

</Slider>

</div>

);

}

}

上一篇下一篇

猜你喜欢

热点阅读