EOS Low-Code Platform 8 EOS Low-Code Platform 8
产品简介
学习指南
更新说明
安装与集成
初见EOS
低代码开发手册
专业代码开发手册
专题场景实战
公共服务框架
应用运行治理
升级手册
常见问题
  • PmFormDialog
  • 基础用法
  • Attributes

# PmFormDialog

# 基础用法

img-form-dialog-01.png
<template>
  <el-button @click="dialogVisible = true">显示弹窗</el-button>
  <pm-form-dialog :dialogVisible.sync="dialogVisible" :inline="true">
    <el-form :model="form" slot="form" :rules="rules" label-position="right" label-width="60px">
      <el-form-item label="姓名" prop="name">
        <el-input v-model="form.name" />
      </el-form-item>
    </el-form>
  </pm-form-dialog>
</template>
<script>
export default {
  data() {
    return {
      dialogVisible: false,
      form: {
        name: ''
      },
      rules:{
        name:[{required:true,message:'不能为空'}]
      }
    }
  },
  methods: {
    async validateResolve(data) {
      console.log(data)
      return true
    },
    cancel() {
      console.log('cancel')
    }
  }
}
</script>

# Attributes

参数 说明 类型 可选值 默认值
dialogVisible 是否显示 Dialog,支持 .sync 修饰符 boolean - false
okText 确定按钮的文字 string - 提交
cancelText 取消按钮的文字 string - 取消
submitable 是否可提交 boolean - true
title 标题 string - -
loading 提交按钮显示loading boolean - false
bodyClass body类名,配合基础样式 string - p-20
formType 表单类型,form或者 其他表单 form类型触发表单校验 form other - form
showFooter 是否显示弹框底部 boolean - true
inline 内联或者组件,默认使用组件引用form形式 boolean - false

:::tip 使用组件form需要在form上设置 formRef属性为form :::

← 弹框 弹出菜单 →