layui表格内容优化
之前图片
价格是从表里的数据,表中为分,对其进行优化
之后图片
看着更加清晰明了
上代码
代码片
.
// cols : [[
{type: 'checkbox',align:'center', width: 80},
{type:'numbers',title:'序号',width: 60},
{field: 'id', title: '编码', width:200,align:'center'},
{field: 'name', title: '产品名称', width:300,align:'center'},
{field: 'imgUrl', title: '产品图片', width:120,align:'center'},
{field: 'price', title: '价格', width:120,align:'center',templet:function(price){
return price.price/100+'元';}} ,
// {field: 'price', title: '价格', width:120,align:'center'} ,
{field: 'goodsType', title: '产品类型', width:120,align:'center'},
//{field: '', title: '状态', width:150,align:'center',toolbar: '#barDemo'},
// {field: '', title: '操作', width:150,align:'center',toolbar: '#barDemo'},
]]
使用templet:function()对表中内容进行修改
function(price)括号中的price可为其他内容,但要和return后面的第一个price对应.第二个price要和field:'price’对应
更多图片展示
代码片
cols : [[
{type: 'checkbox',align:'center', width: 80},
{type:'numbers',title:'序号',width: 60},
{field: 'temperature', title: '空气温度', width:200,align:'center',templet:function(temperature){
return temperature.temperature/10+' ℃';
}},
{field: 'humidity', title: '空气湿度', width:150,align:'center',templet:function(humidity){
return humidity.humidity/10+' %';
}},
{field: 'pmtwo', title: 'PM2.5', width:150,align:'center',templet:function (pmtwo) {
return pmtwo.pmtwo+' ug/m3';
}},
{field: 'pmten', title: 'PM10', width:150,align:'center',templet:function(pmten){
return pmten.pmten+' ug/m3';
}},
{field: 'noise', title: '噪音', width:150,align:'center',templet:function (noise) {
return noise.noise/10+' dB';
}},
{field: 'tvoc', title: '空气品质', width:150,align:'center',templet:function (tvoc) {
return tvoc.tvoc+' PPM';
}},
]]