@@ -1,58 +1,59 @@
|
||||
import React from "react";
|
||||
import { Button, Space } from "antd";
|
||||
import { DownOutlined } from "@ant-design/icons";
|
||||
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";
|
||||
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>
|
||||
);
|
||||
}
|
||||
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;
|
||||
|
||||
Reference in New Issue
Block a user