// 相關鏈接 https://www.npmjs.com/package/react-lazyload
import React from 'react'
import { Card } from 'antd';
import LazyLoad from 'react-lazyload'; // 懶加載
const { Meta } = Card;
export default class extends React.PureComponent {
render() {
const { data } = this.props
return (
<div className='card'>
<Card
hoverable
cover={
<LazyLoad scrollContainer='section' overflow={true} height={200}>
<img alt="example" src={data.image} />
</LazyLoad>
}
>
<Meta title={data.title} description={'¥' + data.price} />
</Card>
</div>
)
}
}
React 圖片懶加載
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.