antd Popconfirm组件样式错乱问题

最新推荐文章于 2024-04-25 10:40:49 发布

璐瑶知码li

最新推荐文章于 2024-04-25 10:40:49 发布

阅读量2.4k

点赞数 3

文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/qq_49464155/article/details/125338732

版权

在表格中使用的时候，Popconfirm组件会出现样式错乱问题，如下：

检查组件元素，发现是在body上创建的元素，我这个table带了横向滚动条，实际上body宽度没有那么大，删除按钮在横向滚动条外，所以就会出现样式错乱问题，可以在使用的时候如下操作（设置getPopupContainer，改变浮层渲染父节点）：

<Popconfirm title='是否要删除？' getPopupContainer={(triggerNode) => triggerNode.parentElement}>
  <Button type='link'>删除</Button>
</Popconfirm>

上面方式是在组件上去优化，还有一种方法是在操作上优化，因为是Table的最后一列操作项，一般来说用户都不希望滑动滚动条去看到操作，所以可以把操作列固定在右侧，table的columns最后一列设置fixed:'right'

关注