import { Image } from 'antd'
import PropTypes from 'prop-types'
import { memo, useEffect } from 'react'
const imgSrc = '/bg/default-img.jpg' //这是以next.js为列的图片引入

const AntdImage = memo(props => {
  let { src, width, height } = props

  const onError = e => {
    return (src = imgSrc)
  }
  return (
    <Image
      width={width}
      height={height}
      src={src}
      preview={false}
      onError={onError}
      fallback={imgSrc}
    />
  )
})

AntdImage.propTypes = {
  src: PropTypes.string.isRequired,
  width: PropTypes.any,
  height: PropTypes.any
}

AntdImage.defaultProps = {
  width: 291,
  height: 158,
  src: imgSrc
}

export default AntdImage