mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-30 06:09:34 +08:00
6776bb8916
* docs: update demo * chore: add script * test: fix demo test * docs: convert demos * chore: move script * test: remove react-dom import * chore: update deps * docs: update riddle js * test: fix image test * docs: fix riddle demo
1.1 KiB
1.1 KiB
| order | title | ||||
|---|---|---|---|---|---|
| 6.1 |
|
zh-CN
配合 react-text-loop-next 或 react-fast-marquee 实现消息轮播通知栏。
en-US
Show a loop banner by using with react-text-loop-next or react-fast-marquee.
import { Alert } from 'antd';
import { TextLoop } from 'react-text-loop-next';
import Marquee from 'react-fast-marquee';
export default () => (
<>
<Alert
banner
message={
<TextLoop mask>
<div>Notice message one</div>
<div>Notice message two</div>
<div>Notice message three</div>
<div>Notice message four</div>
</TextLoop>
}
/>
<Alert
banner
message={
<Marquee pauseOnHover gradient={false}>
I can be a React component, multiple React components, or just some text.
</Marquee>
}
/>
</>
);