vue3 antdv Modal通过设置内容里的容器的最小高度,让Modal能够适当的变高一些

1、当收款信息Collapse也折叠的时候,我们会发现Modal的高度也变成了很小。

2、我们希望高度稍微要高一些,这样感觉上面显示的Modal高度太小了,显示下面的效果。

3、初始的时候,想通过class或者style或者wrapClassName来实现,发现不起作用Ant Design Vue — An enterprise-class UI components based on Ant Design and Vue.js

4、感觉这个Modal是根据内容的高度来自动缩放的,那我们在可以在内容容器设置min-height就可以。

<Collapse v-model:activeKey="activeKey" expandIconPosition="right" accordion style="min-height: 500px;">
        <CollapsePanel key="1" header="基础信息">
         <div>
         </div>
        </CollapsePanel>
        <CollapsePanel key="1" header="收款信息">
         <div>
         </div>
        </CollapsePanel>
</Collapse>
import { Collapse } from 'ant-design-vue';
const CollapsePanel = Collapse.Panel;

这样就可以了。在Collapse上面设置一下min-height。

当然方法应该有多种,可以自己尝试下,如果有时间。

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值