ant-design/components/carousel/demo/basic.md

53 lines
808 B
Markdown
Raw Normal View History

2016-03-31 09:40:55 +08:00
---
order: 0
title:
zh-CN: 基本
en-US: Basic
2016-03-31 09:40:55 +08:00
---
2015-08-03 14:52:26 +08:00
## zh-CN
2015-08-03 14:52:26 +08:00
最简单的用法。
## en-US
Basic usage.
```tsx
import React from 'react';
import { Carousel } from 'antd';
2015-08-03 14:52:26 +08:00
const contentStyle: React.CSSProperties = {
height: '160px',
color: '#fff',
lineHeight: '160px',
textAlign: 'center',
background: '#364d79',
};
const App: React.FC = () => {
const onChange = (currentSlide: number) => {
console.log(currentSlide);
};
return (
<Carousel afterChange={onChange}>
<div>
<h3 style={contentStyle}>1</h3>
</div>
<div>
<h3 style={contentStyle}>2</h3>
</div>
<div>
<h3 style={contentStyle}>3</h3>
</div>
<div>
<h3 style={contentStyle}>4</h3>
</div>
</Carousel>
);
};
export default App;
2019-05-07 14:57:32 +08:00
```