cgreact-layui/types/cgreact-type-input.ts

CGReact基于Layui样式的组件库

/** InputState相关数据结构*/
type CGReactInputState = {//Input的配置
    type?: "text" | "number" | "tel" | "password" | "url" | "email", //input的type类型,默认text
    label?: string | "请输入一个值" | Array<string | "请输入" | "起始值" | "终止值">, //label会作为input的hint渲染,不配置默认"input"
    value?: string | Array<string>, //input当前数据数据,可能是起止值，可以不配置
    multiline?: boolean, //是否多行，多行渲染textArea
    disable?: boolean, //input是否处于激活状态，默认false
    formItem?: CGReactFormItem | boolean  //是否有表单item包括，默认false没有包裹
}// inputState
interface InputState extends CGReactInputState {}

/** InputProps在CGReactCompProp的基础上以input配置作为data的数据类型*/
type CGReactInputLayout = {
    layoutName?: string, //布局的名称属性，渲染为item-name
    layoutWidth?: number | CGReactLength | CGReactGrid | MediaResponse,//布局宽度，水平方向支持删格系统，只有宽度才需要响应式布局
    align?: CGReactAlign, //布局相对于父布局的对其方式，其优先级高于父布局的gravity配置
    layoutDebug?: "debug-off" | "only-layout" | "with-content", //用于调试时显示布局的框子默认false不显示，如果没有配置，子Layout会自动同步父Layout的配置
}
type CGReactInputProp = {
    data?: CGReactInputState, //使用Input数据类型
    layout?: CGReactInputLayout, value?: string,// 输入框的值
};//参数类型
interface InputProp extends CGReactInputProp, CGReactInputLayout, CGReactFormItem {}

/** 回调接口数据类型，可能在state数据类型中交叉使用*/
interface InputConfig //renderInput函数回调接口数据类型
{
    type: "text" | "number" | "tel" | "password" | "url" | "email", // input类型
    label: string, // input的label
    value: string, // input绑定的数据,可能是起止值
    multiline: boolean, //是否多行，多行渲染textArea
    disable: boolean, //input是否处于激活状态，默认false
}