修改ant design vue的modal样式局部覆盖

方法

使用Modal Api 中的getContainer方法，将modal组件挂载到一个html节点上，例如可以挂载到div这个节点
ant-design-vue官方文档

Vue代码

// An highlighted block
<div ref="modal">
    <a-modal
    :title="title"
    :width="width"
    :getContainer="()=>this.$refs.modal"
    :visible="visible"
    :confirmLoading="confirmLoading"
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭"
    >
    </a-modal>
</div>

Style部分

// An highlighted block
<style scoped>
  /deep/ .ant-modal{
     
    top:0px;
    height: 100%;
  }
  /deep/ .ant-modal-footer{
     
    padding: 10px 1px;
  }
  /deep/ .ant-modal-body{
     
    height: 840px;
  }
</style>