日本免费高清视频-国产福利视频导航-黄色在线播放国产-天天操天天操天天操天天操|www.shdianci.com

學無先后,達者為師

網站首頁 編程語言 正文

dialog 對話框垂直居中

作者:樂~~~ 更新時間: 2023-07-28 編程語言

ps :樣式不能寫在scoped里面,否則失效

1.?給dialog?起個類名,custom-class="dialogStyle"

<el-dialog
      v-model="dialogVisible"
      :title="dialogTitle"
      width="38%"
      center
      destroy-on-close
      V-el-drag-dialog
      V-if="dialogVisible"
      append-to-body
      custom-class="dialogStyle"
      :before-close="handleClose"
    >
      <!-- formID 指的是ID -->
      <indexForm
        :newFormdata="newFormdata"
        ref="fromViewRef"
      />
    </el-dialog>

2.?直接復制粘貼此代碼即可生效。

<style>
.dialogStyle {
  display: flex;
  flex-direction: column;
  margin: 0 !important;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-height: calc(100% - 30px);
  max-width: calc(100% - 30px);
}
</style>

如果dialog?內容過多要有滾動,需加下面這句

::v-deep .el-dialog .el-dialog__body{
  flex:1; 
  overflow: auto; 
}

原文鏈接:https://blog.csdn.net/CMDN123456/article/details/131590531

  • 上一篇:沒有了
  • 下一篇:沒有了
欄目分類
最近更新