关于echart.js 中tooltip里面使用formatter图片不能正常显示的解决方法

最近在react项目中用echarts.js想重新定义一个tooltip的展示方式，代码如下：

tooltip : {

trigger: 'item',

 

formatter: function (params) {

return `<div class="toolDiv">

<div>img src={require('public/img/LeftContent/down.png')}/></div>

<div>

`

}

这个在本地的nodejs环境上面图片是能够正常显示的，但是打包发布到服务器上发现图片加载不出来，目前定位出的问题是

在服务器上加载页面的时候没有加载img图片的资源导致图片显示不出来

解决方案：

ooltip : {

trigger: 'item',

 

formatter: function (params) {

return `<div class="toolDiv">

<div class="bg-img"></div>

<div>

`

}

在less文件中

.bg-img{

background:url(图片的路径)

}

通过定义里面的class属性，然后在写里面加背景图片图片就可以正常显示