import React, {Component} from 'react'
|
// import PropTypes from 'prop-types'
|
import { NavBar, Icon, Grid } from 'antd-mobile'
|
import asyncComponent from '@/utils/asyncPage'
|
// import creatHistory from 'history/createHashHistory'
|
import './index.scss'
|
|
const TopSearch = asyncComponent(() => import('@/components/search/topsearch'))
|
|
const creatHistory = require("history").createHashHistory
|
const history = creatHistory()
|
|
const data = Array.from(new Array(9)).map((_val, i) => ({
|
icon: 'https://gw.alipayobjects.com/zos/rmsportal/nywPmnTAvTmLusPxHPSu.png',
|
text: `name${i}`,
|
}));
|
|
const data1 = Array.from(new Array(9)).map(() => ({
|
icon: 'https://gw.alipayobjects.com/zos/rmsportal/WXoqXTHrSnRcUwEaQgXJ.png',
|
}))
|
|
class Advert extends Component {
|
static propTpyes = {
|
// config: PropTypes.object
|
}
|
|
state = {
|
timer: 5,
|
config: null,
|
loaded: false
|
}
|
|
goback = () => {
|
if (window.GLOB.systemType === 'ios' && window.webkit) {
|
window.webkit.messageHandlers.goBack.postMessage(null)
|
} else if (window.GLOB.systemType === 'android' && window.android) {
|
window.android.goBack(null)
|
} else {
|
history.goBack()
|
}
|
}
|
|
componentWillUnmount () {
|
this.setState = () => {
|
return
|
}
|
}
|
|
|
render () {
|
// const { config, loaded, timer } = this.state
|
|
return (
|
<div>
|
<NavBar
|
mode="light"
|
icon={<Icon type="left" />}
|
onLeftClick={() => this.goback()}
|
rightContent={[
|
// <Icon key="0" type="search" style={{ marginRight: '16px' }} />,
|
// <Icon key="1" type="ellipsis" />,
|
]}
|
>NavBar</NavBar>
|
<TopSearch history={this.props.history} />
|
<div>
|
<Grid data={data} activeStyle={false} />
|
|
<div className="sub-title">Grid item adjust accroiding to img size </div>
|
<Grid data={data} square={false} className="not-square-grid" />
|
|
<div className="sub-title">ColumnNum=3 </div>
|
<Grid data={data} columnNum={3} />
|
|
<div className="sub-title">No border</div>
|
<Grid data={data} hasLine={false} />
|
|
<div className="sub-title">Carousel</div>
|
<Grid data={data} isCarousel onClick={_el => console.log(_el)} />
|
|
<div className="sub-title">Custom content</div>
|
<Grid data={data1}
|
columnNum={3}
|
renderItem={dataItem => (
|
<div style={{ padding: '12.5px' }}>
|
<img src={dataItem.icon} style={{ width: '75px', height: '75px' }} alt="" />
|
<div style={{ color: '#888', fontSize: '14px', marginTop: '12px' }}>
|
<span>I am title..</span>
|
</div>
|
</div>
|
)}
|
/>
|
<div className="sub-title">Custom GridCell Style</div>
|
<Grid data={data1} columnNum={3} itemStyle={{ height: '150px', background: 'rgba(0,0,0,.05)' }} />
|
</div>
|
</div>
|
)
|
}
|
}
|
|
export default Advert
|
