官网:https://vxeui.com <template><div><vxe-formv-bind="formOptions"@submit="submitEvent"@reset="resetEvent"></vxe-form></div></template><script>import{VxeUI}from'vxe-pc-ui'exportdefault{ data () {constformOptions = {data: {name:'test1',nickname:'',sex:'',age:'',address:''},...
<template><div><vxe-formv-bind="formOptions"></vxe-form></div></template><script>exportdefault{ data () {constformOptions = {border:true,titleBackground:false,verticalAlign:'center',titleWidth:100,data: {name:'test1',nickname:'Testing',sex:'女',age:'22',mobile:'',professionalSkill:'...
Form(表单) Toolbar(工具栏) Tree table (树形表格) Editable CRUD(增删改查) Validate(数据校验) Data Proxy(数据代理) Keyboard navigation(键盘导航) Modal window(模态窗口) Modules Core (核心) (表格) Modules (可选模块) (图标) (表头) (表尾) (筛选) (提示信息) (快捷菜单) (导出) (按键导...
.vxe-form--item-trigger-node{ display:inline-block; vertical-align:middle; } .vxe-form--item-title{ max-width:320px; padding-right:0.8em; &.is--ellipsis{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .vxe-form--item-title-prefix, ...
在过往 Vue 3 业务中,VXETable 虚拟滚动表格中嵌套 ElementPlus Form 表单时,会出现表单校验不正确的问题。 业务中使用ElementPlus作为基本组件库。业务需求是在一个表格中嵌套表单,展示数据,并允许数据修改,具体如下: 回显数据有 200 条以上; 可以新增单条数据; ...
可复现的链接: https://codesandbox.io/s/vxe-table-3-x-vue-2-6-wen-ti-yan-shi-forked-6sz646?file=/src/views/Demo1.vue 问题描述与截图: 如下图所示,el-form 中的 size 属性不生效 期望的结果: 尽快修复 操作系统: Windows 10 浏览器版本: chrome 99.0.4844.51 vu
在 Vue 3 业务中,当使用 VXETable 这个虚拟滚动表格组件并嵌套 ElementPlus 的 Form 表单时,可能会遇到表单校验不正确的问题。业务需求是在表格中嵌套表单,用于展示和修改数据。如果直接使用 ElementPlus 的 Table 组件一次性渲染全部元素,会导致需要绑定的事件数量过大(例如200 * 6 = 1200),从而...
通过实验,确认问题确实与 VXETable 的虚拟滚动功能有关。关闭虚拟滚动,性能下降明显,且校验问题重现。问题根源在于虚拟滚动机制导致一次渲染的数据量减少,而 ElementPlus 的 Form 组件校验机制只针对渲染出来的数据进行。ElementPlus 的 Form 组件校验方法 `validate` 和 `validateField` 等逻辑表明,校验...
FormItem, FormGather, Select, Optgroup, Option, Switch, List, Pulldown, // 表格 Table } from 'vxe-table' import zhCN from 'vxe-table/lib/locale/lang/zh-CN' // 按需加载的方式默认是不带国际化的,自定义国际化需要自行解析占位符 '{0}',例如: ...
54 export function FormValidatorMethod(params: FormValidErrParams): void; 55 export function FormValidatorMethod(params: FormValidErrParams): Error; 56 export function FormValidatorMethod(params: FormValidErrParams): Promise<any>; 57