请选择 进入手机版 | 继续访问电脑版
 找回密码
 立即注册

QQ登录

只需一步,快速开始

Dtttax

银牌会员

280

主题

693

帖子

2233

积分

银牌会员

积分
2233
Dtttax
银牌会员   /  发表于:2019-5-23 11:17  /   查看:3791  /  回复:6
本帖最后由 Dtttax 于 2019-5-23 14:25 编辑

请问 SpreadJS 数据绑定时 能否做到 两级标题呢? 然后 子标题 可以做 排序/过滤/group ungroup效果类似这样



然后对数据绑定的 可以设置 一部分区域可以编辑, 一部分不能编辑。


在vue下,workbookInitialized 之后调用这个方法,报错.   但是这段代码 只用编辑成 html,在浏览器中打开报错!  请问这里需要如何解决


const func2 = (spread) => {
          var spreadNS = GC.Spread.Sheets;
            //Get sheet instance
            spread.suspendPaint();
            var sheet = spread.getActiveSheet()
            sheet.name("FINANCE CHARGE");

            var table = sheet.tables.add("tableRecords", 1, 0, 5, 3, spreadNS.Tables.TableThemes.light6);

            table.autoGenerateColumns(true);

            var tableColumn1 = new spreadNS.Tables.TableColumn();
            tableColumn1.name("FirstName1");
            tableColumn1.dataField("FirstName");
            var tableColumn2 = new spreadNS.Tables.TableColumn();
            tableColumn2.name("LastName2");
            tableColumn2.dataField("LastName");
            var tableColumn3 = new spreadNS.Tables.TableColumn();
            tableColumn3.name("Title3");
            tableColumn3.dataField("Title");

            table.bindColumns([tableColumn1, tableColumn2, tableColumn3]);

            table.bindingPath('records');
            console.log(table)

            spread.resumePaint();

            var source = [
                { LastName: "Freehafer", FirstName: "Nancy", Title: "Sales Representative", Phone: "(123)555-0100"},
                { LastName: "Cencini", FirstName: "Andrew", Title: "Vice President, Sales", Phone: "(123)555-0101"},
                { LastName: "Kotas", FirstName: "Jan", Title: "Sales Representative", Phone: "(123)555-0102"},
                { LastName: "Sergienko", FirstName: "Mariya", Title: "Sales Representative", Phone: "(123)555-0103"},
            ];

            sheet.setDataSource(
              new spreadNS.Bindings.CellBindingSource(
              {
              records: source
            })
            );

            sheet.bind(GC.Spread.Sheets.Events.CellClick, (sender, args) => {
              console.log(sheet.getDataSource())
            })

}


本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x

6 个回复

倒序浏览
KevinChen讲师达人认证 悬赏达人认证 SpreadJS 开发认证
论坛元老   /  发表于:2019-5-23 15:02:04
沙发
您好,

1、关于表格表头的问题:

表格绑定数据,可以把表头行隐藏,然后在表头上方设置自定义表头和筛选,参考一个示例:

https://www.grapecity.com.cn/blogs/spreadjs-combined-with-java
回复 使用道具 举报
Dtttax
银牌会员   /  发表于:2019-5-23 15:08:44
板凳
KevinChen 发表于 2019-5-23 15:02
您好,

1、关于表格表头的问题:

不只是表头。
因为 标题需要分成 两级, 例子中的标题都只有一级。
new GC.Spread.Sheets.Tables.TableColumn() 这样new出来就是一个标题, 这里怎么做副标题?

看样例,可能使用到TableManager    直接绑定数据到表格, 因为这部分数据 首先需要显示到这儿,然后如果修改 还需要将数据保存。 同实际的数据保持一致。
但是在vue中报错了,直接写的html没有报错。

还有一个问题就是 如果使用到TableManager  直接绑定了数据到表格中, 样式(字体颜色/底色)修改了,是否能够获取出来?
回复 使用道具 举报
KevinChen讲师达人认证 悬赏达人认证 SpreadJS 开发认证
论坛元老   /  发表于:2019-5-23 18:14:57
地板
您好,示例中实际上是这样做的,把表头行隐藏起来,表头上方是单元格区域,可以自由地合并单元格。

您描述的副标题,在Excel中也是无法用table实现的,因为table是没法执行合并单元格操作,所以也是通过这种方式来实现。

关于代码报错,只看这段代码是没问题的,VUE中的报错目前没能重现,请您检查一下VUE依赖的npm包是否统一,提供一下版本号。
回复 使用道具 举报
Dtttax
银牌会员   /  发表于:2019-5-28 10:55:22
5#
KevinChen 发表于 2019-5-23 18:14
您好,示例中实际上是这样做的,把表头行隐藏起来,表头上方是单元格区域,可以自由地合并单元格。

您描 ...

这是一个带node_modules的包,可以复现这种情况。 还请看一下是我们包版本的问题还是其他导致的? 我们无法排除到具体问题,每次npm i后都会报这个错。

链接: https://pan.baidu.com/s/1HlUO-aUB8HuW36ecJxgyqw 提取码: 3d38 复制这段内容后打开百度网盘手机App,操作更方便哦


执行
sheet.setDataSource(source);

打断点 看到 是执行 a instanceof p判断CellBindingSource的时候走向了不同分支. 后续就报错了

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
回复 使用道具 举报
KevinChen讲师达人认证 悬赏达人认证 SpreadJS 开发认证
论坛元老   /  发表于:2019-5-28 16:50:41
6#
您好,我这边重新build了一下就好了,因此可以确定是npm包的问题,具体原因还在排查,后续进展会继续回帖。
回复 使用道具 举报
KevinChen讲师达人认证 悬赏达人认证 SpreadJS 开发认证
论坛元老   /  发表于:2019-5-28 17:01:11
7#
您好,注意到您build包是使用了cnpm,但镜像出来的npm包有问题,如图:





请使用npm重新build工程。

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 立即注册
返回顶部