优化avue导出功能

发布时间 2023-06-01 18:02:18作者: MyKai

avue导出,不能自定义字段的问题

在使用avue导出的时候,发现导出不能自定义字段,导致一些搜索项的配置,也在导出列表里

修改了部分源码,实现了自定义导出字段的功能

通过 showColumn来控制显隐

  • 搜索columnOption,增加computed参数

                    columnExportOption: function() {
                        var t = this.deepClone(this.crud.columnOption);
                        return t.forEach((function(t) {
                            var e = t.children;
                            e && !Array.isArray(e) && delete t.children
                        })), t.filter(i => {
                            return i.showColumn != false
                        })
                    },

这里主要是修改显示的导出字典

  • 修改columns 方法
              columns: function() {
                        var t = this,
                            e = this.deepClone(this.columnExportOption);
                        if (!this.form.params) return [];
                        if (this.form.params.includes("headers")) {
                            return function e() {
                                var n = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : [];
                                n.forEach((function(i, o) { i.children ? e(i.children) : t.form.prop.includes(i.prop) || n.splice(o, 1) }))
                            }(e), e
                        }
                        var n = [];
                        return function e() {
                            var i = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : [];
                            i.forEach((function(i, o) { i.children ? e(i.children) : t.form.prop.includes(i.prop) && n.push(i) }))
                        }(e), n
                    }

这里修改实际导出的数据。

通过增加部分属性源码,你也可以根据自己的需求 return i.showColumn != false不同的参数,实现业务逻辑。