Ant Design Vue的table组件高度自适应问题

今天在编写公司项目的时候碰到ant design vue的table组件高度没办法自适应的问题,会出现如下页面情况。

Ant Design Vue的table组件高度自适应问题_第1张图片

 最终尝试的解决方案只能通过监听浏览器窗口变化实现自适应

(1)给表格的srcoll定义一个动态接收参数,方便后面数据增加动态改变滚动高度。

Ant Design Vue的table组件高度自适应问题_第2张图片

 (2)vue3项目中就直接在setup()中设定组件滚动区域的宽和高参数,最后通过return返回这个动态参数给表格接收即可。

Ant Design Vue的table组件高度自适应问题_第3张图片

 Ant Design Vue的table组件高度自适应问题_第4张图片

 (3)如果是在vue2项目中就需要如下做法:

Ant Design Vue的table组件高度自适应问题_第5张图片

 回归正传,设置完成之后便可得到自适应的表格页面显示。

Ant Design Vue的table组件高度自适应问题_第6张图片

 

 

你可能感兴趣的:(ant,design,vue,vue.js,前端,javascript,anti-design-vue)