解决ant-design Warning: [antdv: `expandedRowRender` and `scroll` are not compat

想使用vben框架下的BasicTable,并且使用expandedRowRender插槽,内嵌一个子表。

发现写好后,表格没有横向滚动条,看BasicTable代码发现,使用扩展插槽会过滤scroll属性,导致无法出现横向滚动条。

if (slots.expandedRowRender) {
    propsData = omit(propsData, 'scroll');
}

注释这个代码后,滚动条会出现,但是ant-desgin会报错 `expandedRowRender` and `scroll` are not compat

为了解决这个warning,只好找其他方法,让滚动条出现。

需改Table样式+固定列宽

 :deep(.ant-table-body) {
    overflow: auto;
  }

//并且将所有列宽度固定,否则会丢失列
export const columnsHeader = [
  {
    title: '姓名',
    dataIndex: 'n',
    width: 150,
  },
  {
    title: '地址',
    dataIndex: 'a',
    width: 550,
  },
  {
    title: '电话',
    dataIndex: 'b',
    width: 150,
  },
  {
    title: '归属地',
    dataIndex: 'c',
    width: 150,
  },
];

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值