ant-design-vue/components/vc-lazy-load/demo/index.jsx

39 lines
1.2 KiB
React
Raw Normal View History

2018-04-06 16:20:45 +00:00
import LazyLoad from '../src/LazyLoad'
import './style.less'
const Application = {
render () {
return (
<div>
Scroll to load images.
<div class='filler' />
<LazyLoad height={762} offsetVertical={300}>
<img src='http://apod.nasa.gov/apod/image/1502/HDR_MVMQ20Feb2015ouellet1024.jpg' />
</LazyLoad>
<div class='filler' />
<LazyLoad height={683} offsetVertical={300}>
<img src='http://apod.nasa.gov/apod/image/1502/2015_02_20_conj_bourque1024.jpg' />
<span/>
</LazyLoad>
<div class='filler' />
<div class='ScrollableContainer'>
<div class='filler' />
<div class='filler' />
<div class='filler' />
<LazyLoad height={480}>
<img src='http://apod.nasa.gov/apod/image/1502/MarsPlume_jaeschke_480.gif' />
</LazyLoad>
</div>
<div class='filler' />
<LazyLoad height={720} offsetVertical={300}>
<img src='http://apod.nasa.gov/apod/image/1502/ToadSky_Lane_1080_annotated.jpg' />
</LazyLoad>
<div class='filler' />
</div>
)
},
}
export default Application