vxe-table-plugin-validator v4.0.0

vxe-table-plugin-validator

基于 vxe-table 的表格插件，提供一些常用的校验

Compatibility

依赖 vxe-table v4 版本

Installing

npm install xe-utils vxe-table@next vxe-table-plugin-validator@next

// ...
import VXETable from 'vxe-table'
import VXETablePluginValidator from 'vxe-table-plugin-validator'
// ...

VXETable.use(VXETablePluginValidator)

API

Validator codes

Demo

<vxe-table
  :data="tableData"
  :edit-config="{trigger: 'click', mode: 'cell'}"
  :edit-rules="editRules">
  <vxe-column type="seq" width="60"></vxe-column>
  <vxe-column field="name" title="Name" :edit-render="{name: 'input'}"></vxe-column>
  <vxe-column field="mobile" title="Mobile" :edit-render="{name: 'input'}"></vxe-column>
  <vxe-column field="email" title="Email" :edit-render="{name: 'input'}"></vxe-column>
</vxe-table>

export default {
  data () {
    return {
      tableData: [
        { id: 100,  name: 'test1', mobile: '', email: '' },
        { id: 101,  name: 'test2', mobile: '', email: '' },
        { id: 102,  name: 'test3', mobile: '', email: '' }
      ],
      editRules: {
        mobile: [
          { required: true, validator: 'MOBILE_NUMBER' }
        ],
        email: [
          { required: true, validator: 'EMAIL_ADDRESS' }
        ]
      }
    }
  }
}

License

MIT License, 2019-present, Xu Liangzhan