问题背景
如图所示,这个按钮
我要点击的时候,显示一张图片
实现方法
// state中定义
popoverContent: (
<img src={require('./illustrate.png')} style={{ width: '200px', height: 'auto' }} alt='图片' />
),
popoverContent: (
<img src={'./illustrate.png'} style={{ width: '200px', height: 'auto' }} alt='图片' />
),
<Popover
content={popoverContent}
placement='bottomRight'
title={this.props.t('funds:fundTag.illustrate')}
trigger='click'
>
<Button type='primary'>{this.props.t('funds:fundTag.illustrate')}</Button>
</Popover>
这两种定义方式,都结果如下:
md. 不显示
话不多说,直接上解决方法
解决方法
import illustrate from './illustrate.png' // 关键是这一步!!!!
popoverContent: (
<img src={illustrate} style={{ width: '200px', height: 'auto' }} alt='图片' />
),
<Popover
content={popoverContent}
placement='bottomRight'
title={this.props.t('funds:fundTag.illustrate')}
trigger='click'
>
<Button type='primary'>{this.props.t('funds:fundTag.illustrate')}</Button>
</Popover>
效果: