60 lines
2.1 KiB
JavaScript
60 lines
2.1 KiB
JavaScript
import React from "react";
|
|
import {Button, Space} from "antd";
|
|
import {DownOutlined} from "@ant-design/icons";
|
|
import QueueAnim from "rc-queue-anim";
|
|
import TweenOne from "rc-tween-one";
|
|
import {isImg} from "./utils";
|
|
|
|
class Banner extends React.PureComponent {
|
|
render() {
|
|
const {...currentProps} = this.props;
|
|
const {dataSource} = currentProps;
|
|
delete currentProps.dataSource;
|
|
delete currentProps.isMobile;
|
|
return (
|
|
<div {...currentProps} {...dataSource.wrapper}>
|
|
<QueueAnim
|
|
key="QueueAnim"
|
|
type={["bottom", "top"]}
|
|
delay={200}
|
|
{...dataSource.textWrapper}
|
|
>
|
|
<div key="title" {...dataSource.title}>
|
|
{typeof dataSource.title.children === "string" &&
|
|
dataSource.title.children.match(isImg) ? (
|
|
<img src={dataSource.title.children} width="100%" alt="img"/>
|
|
) : (
|
|
dataSource.title.children
|
|
)}
|
|
</div>
|
|
<div key="content" {...dataSource.content}>
|
|
{dataSource.content.children}
|
|
</div>
|
|
<Space wrap>
|
|
<Button ghost key="button" {...dataSource.button}>
|
|
{dataSource.button.children}
|
|
</Button>
|
|
<Button type="primary" key="button2" {...dataSource.button2}>
|
|
{dataSource.button2.children}
|
|
</Button>
|
|
</Space>
|
|
</QueueAnim>
|
|
<TweenOne
|
|
animation={{
|
|
y: "-=20",
|
|
yoyo: true,
|
|
repeat: -1,
|
|
duration: 1000,
|
|
}}
|
|
className="banner0-icon"
|
|
key="icon"
|
|
>
|
|
<DownOutlined/>
|
|
</TweenOne>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default Banner;
|