table-form-item

table-form-item

适用于 vue项目中使用 element-ui组件库的项目，用于解决el-table中的表单校验的痛点，也可以在任何其他组件中使用。

Install

npm install table-form-item

Usage

全局注册组件

import TableFormItem from "table-form-item";

Vue.use(TableFormItem);

或者局部组件中引用:

import { tableFormItem as TableFormItem } from "table-form-item";

export default {
  components: {
    TableFormItem
  },
};

然后再模板(template)中使用:

<template>
  <TableFormItem :row="form" prop="name" required="true" label="名称">
    //插槽内容
    <el-input type="input" v-model="form.name" />
  </TableFormItem>
</template>

export default {
  data () {
    return {
      form: { 
         value: '' 
      }
    }
  }
}

Api文档

属性	描述	类型	必传	默认值
row	需要校验的对象	object	Y	null
required	校验必填	boolean	N	false
prop	属性值	string	Y	-
label	required校验未通过时会用到，不传的话使用的是prop	string	N	-
rules	校验规则与el-form中rules一致	array[object]	N	-
default	默认插槽，插槽内容可以是表单元素,默认值是	---	Y	-

License

MIT ©