如何在制表器中显示图像

如何解决如何在制表器中显示图像

我是 reactjs 的新手，也是制表机的新手。我正在使用 sql 数据库中的数据库列设置制表符。在 sql 数据库中，存在图像 url 列，在浏览器中打开时会显示图像。

我正在按如下方式设置我的制表符：

const ForwardInventoryColumns=[
      {formatter:"responsiveCollapse",width:30,minWidth:30,align:"center",resizable:false,headerSort:false},{
        title: "",field: "",align: "center",headerSort:false,formatter: reactFormatter(<UpdateDataButton />),},{ title: "Type",field: "type",minWidth : 20,headerSort: false,headerFilter: "input",headerFilterPlaceholder:"search...",visible:true},{ title: "ID",field: "id",minWidth : 150,{ title: "Description",field: "desc",minWidth : 40,editor: "number",editorParams: {allowEmpty: false},cellEdited:this.updateTableData,validator:{type:"max",parameters:99999999 },{ title: "ImageURL",field: "imgurl",{ title: "Active",field: "active",visible:true}

我想在我的前端呈现的表格中将图像 url 列显示为 url 的图像。 我该怎么做？

解决方法

使用“图像”格式化程序。来自 v4.9 文档：

{title:"Example",field:"example",formatter:"image",formatterParams:{
    height:"50px",width:"50px",urlPrefix:"http://website.com/images/",urlSuffix:".png",}}

“示例”字段中数据的“值”将放置在 urlPrefix 和 urlSuffix 值之间。如果您的数据具有完整网址，请不要在列定义中使用这些参数中的任何一个。