vxe-table目前已经很优秀了,现在项目需求进行勾选,发现了卡顿现象 Vue3/Vite 3千条数据进行测试,调用: const setSelectRow = (rows, checked) => { const $table = tableRef.value if ($table) { $table.setCheckboxRow(rows, checked) } }
在开发 vue 大型项目中,必然少不了 vxe-table 专业的表格库,当同时配合 element-plus 组件库使用时,发现一个问题,就是在单元格中渲染 el-select 时,会导致下拉选项无法被选中,点击后立马就消失,看了 vxe-table 官方文档,是支持与任意第三方库集成的,发现官网扩展插件里面有个适配插件安装一下就可以了正常选择了...
<el-select v-model="row.name" :popper-append-to-body="false" > ... 1. 2. 3. 4. 5.
通过控制变量,我们很容易确认是滚动导致了问题,进而很容易猜测是 VXETable 的虚拟滚动功能导致了问题。 我们可以修改<vxe-table>的scroll-y属性来验证一下,我们将enabled设置成false强制禁用虚拟滚动,会发现卡顿明显了不少,而且滚动后再点击“提交”按钮不能通过校验。如果换回 ElTable,卡顿感会更为明显,同样地,滚动...
"@cell-click="click":edit-config="{ trigger: 'dblclick', mode: 'cell' }"><vxe-table-columntitle="是否主职"field="isMainJob":edit-render="{name:'$select',options:[{value:true,label:'是'},{value:false,label:'否'}],events:{change:selectChange}}"></vxe-table-column></vxe-table...
在使用vxe-table组件库时,想要自定义配置其中vxe-select组件的option选项,实现 类似element-ui中下拉框的插槽效果。 但是根据官网的介绍,使用option插槽无效。并且官网示例中也是无效的。 尝试 查找原因,在官网中发现: vxe-option的option插槽只适用于v3.3.8。我下载的版本是v3.5.9,是符合要求的 。
在我的项目中使用vxe table组件时,edit-render配置{name: '$select', options: [{label:"脉搏",value:"maibo"},{label:"体温",value:"temp"}...]}。 当激活单元格的edit-render选中某个option后, 移走或关闭单元格(cell)的激活状态,此单元格会显示option的value而不是label,value是与后台交互的代码,lab...
vxe-table是一个功能齐全的表格解决方案,设置可编辑状态输入下拉框等组件默认是不显示的,只有点击或者双击通过其他事件才能触发,为此我尝试了很多方法改样式改底层代码很麻烦,最后使用插槽搭配表格的属性来实现,通过在vxe-table的edit-render中的autofocus属性实现点击其他元素聚焦select输入框从而显示option列表,然后使用插槽...
在我的项目中使用vxe table组件时,edit-render配置{name: '$select', options: [{label:"脉搏",value:"maibo"},{label:"体温"
在vxe-table中定义列,并指定列为下拉选项类型: 在定义vxe-table的列时,你需要指定某一列为下拉选项类型,通常是通过editor属性来配置vxe-select编辑器。 javascript const columns = [ { field: 'name', title: 'Name', width: 180 }, { field: 'status', title: 'Status', width: 180, editor: { ty...