@eosine/form NPM

@eosine/form

安装

npm install @eosine/form --save

使用

全局引入

import EosForm from "@eosine/form";

Vue.use(EosForm, {
  getData: "<Function>",
  getConfig: "<Function>",
  getDict: "<Function>",
  uploadUrl: "<String>",
  uploadHeaders: "<Object>",
});

按需引入

import { EosForm, SetGlobalConfig } from "@eosine/form";
// 设置全局配置
SetGlobalConfig({
  getData: "<Function>",
  getConfig: "<Function>",
  getDict: "<Function>",
  uploadUrl: "<String>",
  uploadUrlPrefix: "<String>",
  uploadHeaders: "<Object>",
  uploadData: "<Object>",
  Plugin:{
    Amap:"{Type:"",Key:"",Code:""}",
  }
});

Form GlobalConfig 全局配置

属性名	说明	类型	默认值
getData	统一数据请求	Function	-
getConfig	统一配置请求	Function	-
getDict	统一字典请求	Function	-
uploadUrl	统一上传地址	String	-
uploadUrlPrefix	统一上传地址前缀	String	/eos-api
uploadHeaders	统一上传请求头	Object	-
uploadData	统一上传附加参数	Object	-
Plugin	插件	Object	-
Plugin.Amap	高德地图	Object	-

Form Attributes 组件属性

属性名	说明	类型	默认值
v-model	绑定值	Object	-
config	配置	Array	-
detail	详情模式	Boolean	false
labelWidth	标签宽度	Number, String	100px
ctrlWidth	组件宽度	Number, String	-
labelPosition	标签位置	String	right
size	尺寸	String	default
inline	是否行内表单	Boolean	false

Form Events 组件事件

事件名	说明	回调参数
select	选择器时触发	Object
enter	回车键时触发	Function
labelClick	标签点击时触发	Object
desEyeClick	获取脱敏信息触发	Object

Form Ref Exposes 组件 Ref 暴露的方法

方法名	说明	类型
rules	验证规则	Object
validate	校验表单返回 Promise	Function
resetFields	重置表单	-
update	更新表单	Function
group	分组对象	Object
group.data	分组数据	Array
group.targetShow	分组显示状态切换	Function

Form Slots 组件插槽

组件名	插槽名	说明
slot	<字段名>	! 本地配置独享
subTable	SubTable	子表插槽
TransferTree	TransferTree	穿梭树插槽
ExSteps	ExSteps	运输规则节点
ExWarning	ExWarning	预警标题