在layui弹出层遍历展示图片

Layui获取到后端传来的图片地址,如何在img标签中显示?

我试了三种方法，

一是直接在表格中显示

代码

第二种跟第一种差不多，也是放链接点击查看，我用的是springboot工程，外部资源映射后的地址是 / ,所以我的地址前面都有个/,项目能直接访问

第三种是弹框的形式，我的数据库存的是多个图片的拼接，所以还要分割出图片名
效果图：


遍历分割出的图片名，添加到arr数组中，定义一个layui弹出层，填充arr数组，即可显示

部分代码，行工具使用可查官方文档

var str = data.detailImg;//地址串
var imgs =str.substring(0, str.length - 1);//去除最后一个逗号
var images = imgs.split(",");//分割
var arr = [];
for(var i = 0;i < images.length;i++){
    arr += '<div><img width="150px"  class="layui-upload-img Image" src="/'+ images[i] +'"  ></div>';
}
layer.open({
    type:0,
    title: "详情图",
    area: ['350px', '550px'],//弹出框的宽高
    content: arr
})