workbook的父容器是flex样式，咋办？

收藏

如果，spreadJS所在的容器是flex容器，而且全部是自动高度，宽度，这个时候，spreadJS就完全显示不出来了，咋办？因为业务需求spreadJS必须自适应父容器宽高的

Derrick.Jiao · Derrick.Jiao

本帖最后由 Derrick.Jiao 于 2021-6-7 12:13 编辑

完全显示不出来具体是如何表现呢？SpreadJS的大小跟着承载他的容器走的。您可以尝试调用spread.refresh();刷新。本质上来说SJS只是一个dom节点，无法自适应容器的这个问题SJS自身设计无关。建议您再查阅下flex布局相关的资料。若仍未解决您的问题，麻烦您提供一个demo这边调研一下。

湖南大商帮 · 湖南大商帮

本帖最后由湖南大商帮于 2021-6-7 17:25 编辑

问题解决了，父容器是flex，子容器是spreadJS的话，需要指定spreadJS的宽度，高度为100%

<gc-spread-sheets class="gc-spreadSheets">
<gc-worksheet ref="xmgcSheet">
</gc-worksheet>
</gc-spread-sheets>
.gc-spreadSheets {
min-height:100%;width:100%;
}

复制代码

Derrick.Jiao · Derrick.Jiao

湖南大商帮发表于 2021-6-7 17:24
问题解决了，父容器是flex，子容器是spreadJS的话，需要指定spreadJS的宽度，高度为100%

解决了就好，有新问题欢迎开新帖交流~

湖南大商帮 · 湖南大商帮

这个问题的终极解决办法我已经找到了：
1.父容器是flex
2.spread自身的div也设置成flex，然后指定flex:1;width:100%;height:100%;
3.workbookInitialized的时候，弄个全局数组push一下spread对象
3.当鼠标去拖拉页面父容器的高宽比动作结束后，主动触发window.resize事件
4.当页面acitved的时候，循环数组，主动调用 spread.refresh()方法，即可

Derrick.Jiao · Derrick.Jiao

湖南大商帮发表于 2021-6-17 10:56
这个问题的终极解决办法我已经找到了：
1.父容器是flex
2.spread自身的div也设置成flex，然后指定flex:1; ...

感谢您的分享，如果能附上对应的demo就更好了

		自动登录	找回密码
密码			立即注册

[已处理] workbook的父容器是flex样式，咋办？

5 个回复

评分

评分

SpreadJS 高级认证

讲师达人

GrapeCity

悬赏达人

SpreadJS 认证