iview 在table中渲染Poptip、img，做了个悬浮框显示图片的效果
用vue，绑定table，本来渲染二维码图片的外面还套了个div，但是不知道为什么就显示不出内容了，把div删了直接用img就能正常显示了
historyColumns: [
{
title: '标题',
key: 'F_Title',
sortable: true,
width: 250,
},
{
title: '创建时间',
key: 'F_CreatorTime',
sortable: true,
width: 110,
align: 'center',
render: (h, params) => {
return h('div', new Date(params.row.F_CreatorTime).Format('yyyy-MM-dd'));
}
},
{
title: '牌位类型',
key: 'F_PaiWeiType_Name',
sortable: true,
width: 140,
},
{
title: '法会类型',
key: 'F_Type',
sortable: true,
width: 190,
},
{
title: '法会时间',
key: 'f_date',
sortable: true,
align: 'center',
width: 190,
render: (h, params) => {
var F_FaHuiDate = new Date(params.row.F_FaHuiStartDate).Format('yyyy-MM-dd') + '至' + new Date(params.row.F_FaHuiEndDate).Format('yyyy-MM-dd');
return h('div', F_FaHuiDate);
}
},
{
title: '法会时间（阴历）',
key: 'F_FaHuiDateYinLi',
sortable: true,
align: 'center',
width: 250,
},
{
title: '间隔',
key: 'F_Interval',
sortable: true,
align: 'center',
width:90
},
{
title: '状态',
key: 'F_Status',
sortable: true,
align: 'center',
width: 130,
render: (h, params) => {
let result = '';
let color = '';
if (params.row.F_Status == null || params.row.F_Status == '@ConstantUtils.F_Status.NOTAUDITED') {
result = '已禁用';
color = '@ConstantUtils.F_Color.ERROR';
}
if (params.row.F_Status == null || params.row.F_Status == '@ConstantUtils.F_Status.AUDITED') {
result = '已启用';
color = '@ConstantUtils.F_Color.SUCCESS';
}
return h('Tag', {
props: {
type: 'dot',
color: color
}
}, result);
}
},
{
title: '操作',
key: 'f_id',
width: 310,
fixed: 'right',
align: 'center',
render: (h, params) => {
return h('div',
[
h('Button',
{
props: {
type: 'success',
size: 'small'
},
style: {
marginRight: '5px'
},
on: {
click: () => {
vm.value1 = true;
vm.Keyword2.F_FaHui_Id = params.row.F_Id;
vm.getlistActions2()
}
}
},
'名单'),
h('Button',
{
props: {
type: 'info',
size: 'small',
},
style: {
marginRight: '5px'
},
on: {
click: () => {
vm.btn_Form(h, params, '修改')
}
}
},
'修改'),
h('Button',
{
props: {
type: 'error',
size: 'small',
},
style: {
marginRight: '5px'
},
on: {
click: () => {
vm.remove(h, params)
}
}
},
'移除'),
h('Button',
{
props: {
type: 'warning',
size: 'small',
},
style: {
marginRight: '5px'
},
on: {
click: () => {
vm.showFaHuiType(h, params);
}
}
},
'打印'),
h('Poptip',
{
props: {
placement: 'left',
title: '扫码进入',
width: 350,
},
},
[
h('Button',
{
props: {
type: 'dashed',
size: 'small',
},
},
'扫码进入'),
h('img',
{
slot: 'content',
style: {
width: '100px',
height: '100px',
},
attrs: {
src: 'https://api.btstu.cn/qrcode/[email protected]' + params.row.F_Id
}
},
),
]),
]);
}
}
],