提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  Java

当前栏目

vxe-table高级表格数据刷新失败

2023-02-18 15:49:47 时间

问题出现

使用vxe-grid的时候，更新options.data失败，但控制台打印实实在在更新上了。

注：options为v-bind的内容

具体的API配置项参考官方文档：https://vxetable.cn/v3/#/grid/api

尝试解决

以为是vxe-grid没有监听到data的改变，尝试使用this.$set去改变data无果，列表显示的数据依旧异常。

最终解决办法

排查各种因素之后，发现是在配置项中，没有带上data字段，导致问题的出现。

在配置项中给data初始化一个空的Array便可以解决该问题。

options: {
                border: true,
                resizable: true,
                showOverflow: true,
                height: 300,
                align: 'left',
                toolbarConfig: {
                  slots: {
                    // 自定义工具栏模板
                    buttons: 'toolbar_buttons'
                  }
                },
                columns: [
                  { type: 'seq', width: 50 },
                  { field: 'name', title: 'Name' },
                  { field: 'sex', title: 'Sex', showHeaderOverflow: true },
                  { field: 'address', title: 'Address', showOverflow: true }
                ],
                // 设置配置项时一定要加上
                data: []
              }

相关文章